/* ============================================================
   轮回乐园 · PARADISE TERMINAL UI v1.0
   全局命名空间前缀 rl  禁止使用 id 选择器
   ============================================================ */

/* ---------- 设计公理层：颜色与尺度令牌 ---------- */
.rlmain {
  --rl-void: #05070c;
  --rl-bg0: #080a10;
  --rl-bg1: #0e1220;
  --rl-bg2: #141a2c;
  --rl-bg3: #1c2440;
  --rl-line: #223052;
  --rl-line2: #2e3f68;
  --rl-order: #4dd0ff;
  --rl-order-d: #1d7fa8;
  --rl-chaos: #ff2d55;
  --rl-chaos-d: #a01030;
  --rl-nature: #3ddc97;
  --rl-nature-d: #1a8a5c;
  --rl-gold: #ffc94d;
  --rl-gold-d: #c9a227;
  --rl-txt: #c8d4e8;
  --rl-txt2: #7a8aa8;
  --rl-txt3: #4a5670;
  --rl-cut: 10px;
  --rl-cut-s: 5px;
  --rl-ez-panel: cubic-bezier(.16, 1, .3, 1);
  --rl-ez-slide: cubic-bezier(.65, .05, .36, 1);
  --rl-ez-pop: cubic-bezier(.34, 1.56, .64, 1);
  position: relative;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: calc(100vh - 168px);
  height: calc(100dvh - 168px);
  min-height: 470px;
  max-height: 780px;
  margin: 2px0;
  padding: 0;
  overflow: hidden;
  font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", -apple-system, sans-serif;
  font-size: 13px;
  line-height: 1.7;
  color: var(--rl-txt);
  letter-spacing: .3px;
  background:
    radial-gradient(ellipse 120% 70% at 50% -10%, rgba(77, 208, 255, .11), transparent 62%),
    radial-gradient(ellipse 90% 50% at 100% 108%, rgba(255, 45, 85, .075), transparent 60%),
    linear-gradient(172deg, var(--rl-bg1) 0%, var(--rl-bg0) 45%, var(--rl-void) 100%);
  border: 1px solid var(--rl-line);
  border-radius: 3px;
  isolation: isolate;
  container-type: inline-size;
  container-name: rlbox;
}

/* ============================================================
   1. 外框容器 —— 隔离平台样式，锁定总高度
   ============================================================ */

/* 外框四角机械卡榫 */
.rlmain::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 9;
  pointer-events: none;
  background:
    linear-gradient(90deg, var(--rl-order) 0 22px, transparent 22px) 0 0/100% 1px no-repeat,
    linear-gradient(180deg, var(--rl-order) 0 22px, transparent 22px) 0 0/1px 100% no-repeat,
    linear-gradient(270deg, var(--rl-order) 0 22px, transparent 22px) 100% 0/100% 1px no-repeat,
    linear-gradient(0deg, var(--rl-order) 0 22px, transparent 22px) 100% 0/1px 100% no-repeat,
    linear-gradient(90deg, var(--rl-chaos) 0 22px, transparent 22px) 0 100%/100% 1px no-repeat,
    linear-gradient(0deg, var(--rl-chaos) 0 22px, transparent 22px) 0 100%/1px 100% no-repeat,
    linear-gradient(270deg, var(--rl-chaos) 0 22px, transparent 22px) 100% 100%/100% 1px no-repeat,
    linear-gradient(180deg, var(--rl-chaos) 0 22px, transparent 22px) 100% 100%/1px 100% no-repeat;
  opacity: .85;
}

/* 全屏噪点质感层 —— feTurbulence 生成，注意 baseFrequency 不可过大 */
.rlmain::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  opacity: .038;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

/* 隐藏内部结构区 */
.rlmain wldata,
.rlmain rlock,
.rlmain lck,
.rlmain anchor,
.rlmain .rlanchor {
  display: none !important;
}

/* 集中式 input 全部隐藏 —— display:none 彻底脱离渲染树
   24-1节用!important再次声明，此处为基础声明保持一致
   label的for关联、:checked、~选择器均基于DOM工作，不受display:none影响 */
.rlmain input.rlrd,
.rlmain input.rlck {
  display: none;
}

/* 全局去除 s 标签默认删除线（防止嵌套 s 标签遗漏） */
.rlmain s {
  text-decoration: none;
}

/* ============================================================
   2. 顶栏 —— 时间 / 天气 / 地点 / 设置按钮
   ============================================================ */
.rlmain .rltop {
  position: relative;
  z-index: 6;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0;
  box-sizing: border-box;
  height: 46px;
  padding: 0 12px 0 0;
  background:
    linear-gradient(180deg, rgba(28, 36, 64, .92) 0%, rgba(14, 18, 32, .96) 100%);
  border-bottom: 1px solid var(--rl-line2);
  box-shadow: 0 4px 18px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(120, 180, 240, .09);
}

/* 顶栏底部流动扫描光 */
.rlmain .rltop::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 34%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--rl-order), rgba(255, 201, 77, .9), transparent);
  animation: rlScanX 5.5s linear infinite;
  filter: drop-shadow(0 0 4px rgba(77, 208, 255, .8));
}

@keyframes rlScanX {
  0% { transform: translateX(-105%); }
  100% { transform: translateX(400%); }
}

/* 顶栏左侧品牌徽记 */
.rlmain .rlsigil {
  position: relative;
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  background: linear-gradient(145deg, rgba(77, 208, 255, .16), rgba(255, 45, 85, .08));
  border-right: 1px solid var(--rl-line2);
}

.rlmain .rlsigil::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--rl-order);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 L21 7 L21 17 L12 22 L3 17 L3 7 Z' fill='none' stroke='black' stroke-width='1.3'/%3E%3Ccircle cx='12' cy='12' r='4.2' fill='none' stroke='black' stroke-width='1.3'/%3E%3Cpath d='M12 7.8 L12 4.4 M16.2 12 L19.6 12 M12 16.2 L12 19.6 M7.8 12 L4.4 12' stroke='black' stroke-width='1.1'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 L21 7 L21 17 L12 22 L3 17 L3 7 Z' fill='none' stroke='black' stroke-width='1.3'/%3E%3Ccircle cx='12' cy='12' r='4.2' fill='none' stroke='black' stroke-width='1.3'/%3E%3Cpath d='M12 7.8 L12 4.4 M16.2 12 L19.6 12 M12 16.2 L12 19.6 M7.8 12 L4.4 12' stroke='black' stroke-width='1.1'/%3E%3C/svg%3E");
  -webkit-mask-size: 30px 30px;
  mask-size: 30px 30px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  animation: rlSigilPulse 3.4s ease-in-out infinite;
}

@keyframes rlSigilPulse {
  0%, 100% { opacity: .72; filter: drop-shadow(0 0 3px rgba(77, 208, 255, .5)); }
  50% { opacity: 1; filter: drop-shadow(0 0 9px rgba(77, 208, 255, .95)); }
}

/* 徽记外旋光环 */
.rlmain .rlsigil::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 42px;
  height: 42px;
  margin: -21px 0 0 -21px;
  border: 1px dashed rgba(77, 208, 255, .32);
  border-radius: 50%;
  animation: rlSpin 14s linear infinite;
}

@keyframes rlSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* 顶栏信息槽通用 */
.rlmain .rlslot {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  box-sizing: border-box;
  height: 58px;
  padding: 0 13px;
  border-right: 1px solid rgba(34, 48, 82, .7);
  transition: background .2s ease-out;
}

.rlmain .rlslot:hover {
  background: rgba(77, 208, 255, .07);
}

.rlmain .rlslot > i {
  position: relative;
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  background-color: var(--rl-txt2);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 17px 17px;
  mask-size: 17px 17px;
  transition: background-color .2s ease-out, filter .2s ease-out;
}

.rlmain .rlslot:hover > i {
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 5px rgba(77, 208, 255, .8));
}

.rlmain .rlslot > u {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
  text-decoration: none;
}

.rlmain .rlslot > u > s {
  font-size: 8.5px;
  font-weight: 700;
  color: var(--rl-txt3);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1.4px;
}

.rlmain .rlslot > u > b {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rl-txt);
  letter-spacing: .4px;
  white-space: nowrap;
}

/* 时间槽 —— 数字等宽并带微光 */
.rlmain .rlslot.rltime > u > b {
  font-family: "Consolas", "SF Mono", "Courier New", monospace;
  font-size: 13.5px;
  color: var(--rl-order);
  text-shadow: 0 0 8px rgba(77, 208, 255, .55);
}

.rlmain .rlslot.rltime > i {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M12 7.2 L12 12 L15.6 14.4' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M12 7.2 L12 12 L15.6 14.4' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 4px rgba(77, 208, 255, .6));
}

/* 地点槽 */
.rlmain .rlslot.rlloc {
  flex: 1 1 auto;
  min-width: 0;
  border-right: 1px solid rgba(34, 48, 82, .7);
}

.rlmain .rlslot.rlloc > u {
  min-width: 0;
}

.rlmain .rlslot.rlloc > u > b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rlmain .rlslot.rlloc > i {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21.5s7.2-7 7.2-12.1A7.2 7.2 0 0 0 4.8 9.4C4.8 14.5 12 21.5 12 21.5Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3Ccircle cx='12' cy='9.3' r='2.7' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21.5s7.2-7 7.2-12.1A7.2 7.2 0 0 0 4.8 9.4C4.8 14.5 12 21.5 12 21.5Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3Ccircle cx='12' cy='9.3' r='2.7' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 4px rgba(255, 201, 77, .5));
}

/* ---------- 天气图标穷举映射 ---------- */
.rlmain .rlwx {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rl-txt);
}

.rlmain .rlwx::before {
  content: '';
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 18px 18px;
  mask-size: 18px 18px;
}

.rlmain .rlwx::after {
  content: attr(t);
  white-space: nowrap;
}

.rlmain .rlwx[w="sun"]::before {
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 6px rgba(255, 201, 77, .75));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='4.6' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M12 1.8v3.1M12 19.1v3.1M1.8 12h3.1M19.1 12h3.1M4.8 4.8l2.2 2.2M17 17l2.2 2.2M19.2 4.8L17 7M7 17l-2.2 2.2' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='4.6' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M12 1.8v3.1M12 19.1v3.1M1.8 12h3.1M19.1 12h3.1M4.8 4.8l2.2 2.2M17 17l2.2 2.2M19.2 4.8L17 7M7 17l-2.2 2.2' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  animation: rlSpin 22s linear infinite;
}

.rlmain .rlwx[w="night"]::before {
  background-color: #a8c0e8;
  filter: drop-shadow(0 0 6px rgba(168, 192, 232, .7));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.4 14.6A8.6 8.6 0 0 1 9.4 3.6a8.8 8.8 0 1 0 11 11Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3Ccircle cx='16.8' cy='6.4' r='.9' fill='black'/%3E%3Ccircle cx='19.6' cy='9.6' r='.6' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.4 14.6A8.6 8.6 0 0 1 9.4 3.6a8.8 8.8 0 1 0 11 11Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3Ccircle cx='16.8' cy='6.4' r='.9' fill='black'/%3E%3Ccircle cx='19.6' cy='9.6' r='.6' fill='black'/%3E%3C/svg%3E");
  animation: rlBreath 4.2s ease-in-out infinite;
}

.rlmain .rlwx[w="rain"]::before {
  background-color: #5fb4e8;
  filter: drop-shadow(0 0 5px rgba(95, 180, 232, .7));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 15.4a4.2 4.2 0 0 1 .5-8.4 5.6 5.6 0 0 1 10.7 1.3 3.6 3.6 0 0 1-.8 7.1Z' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M8.4 18.2l-1 2.6M12 18.2l-1 2.6M15.6 18.2l-1 2.6' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 15.4a4.2 4.2 0 0 1 .5-8.4 5.6 5.6 0 0 1 10.7 1.3 3.6 3.6 0 0 1-.8 7.1Z' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M8.4 18.2l-1 2.6M12 18.2l-1 2.6M15.6 18.2l-1 2.6' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  animation: rlRainShift 1.5s steps(3) infinite;
}

@keyframes rlRainShift {
  0% { -webkit-mask-position: center 0; mask-position: center 0; }
  100% { -webkit-mask-position: center 3px; mask-position: center 3px; }
}

.rlmain .rlwx[w="storm"]::before {
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 8px rgba(255, 201, 77, .9));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 14.6a4.2 4.2 0 0 1 .5-8.4 5.6 5.6 0 0 1 10.7 1.3 3.6 3.6 0 0 1-.8 7.1' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M13.2 12.4l-3.6 5.2h2.8l-1.4 4.2 4.4-6h-3Z' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 14.6a4.2 4.2 0 0 1 .5-8.4 5.6 5.6 0 0 1 10.7 1.3 3.6 3.6 0 0 1-.8 7.1' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M13.2 12.4l-3.6 5.2h2.8l-1.4 4.2 4.4-6h-3Z' fill='black'/%3E%3C/svg%3E");
  animation: rlFlash 3.1s steps(1) infinite;
}

@keyframes rlFlash {
  0%, 88%, 100% { opacity: 1; }
  90% { opacity: .25; }
  92% { opacity: 1; }
  94% { opacity: .35; }
}

.rlmain .rlwx[w="snow"]::before {
  background-color: #d8ecff;
  filter: drop-shadow(0 0 6px rgba(216, 236, 255, .8));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4v19.2M3.7 7.2l16.6 9.6M20.3 7.2L3.7 16.8' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M12 6.2l-2 2 2 2 2-2ZM12 15.6l-2 2 2 2 2-2Z' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4v19.2M3.7 7.2l16.6 9.6M20.3 7.2L3.7 16.8' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M12 6.2l-2 2 2 2 2-2ZM12 15.6l-2 2 2 2 2-2Z' fill='black'/%3E%3C/svg%3E");
  animation: rlSpin 9s linear infinite;
}

.rlmain .rlwx[w="fog"]::before {
  background-color: #90a4c4;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 8.4h14M6.6 12h14.4M3 15.6h11.4M17.4 15.6H21M3 19.2h9' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 8.4h14M6.6 12h14.4M3 15.6h11.4M17.4 15.6H21M3 19.2h9' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
  animation: rlFogDrift 4.6s ease-in-out infinite;
}

@keyframes rlFogDrift {
  0%, 100% { opacity: .55; transform: translateX(-1.5px); }
  50% { opacity: 1; transform: translateX(1.5px); }
}

.rlmain .rlwx[w="cloud"]::before {
  background-color: #8fa8c8;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 18.6a4.4 4.4 0 0 1 .5-8.8 5.8 5.8 0 0 1 11.1 1.4 3.8 3.8 0 0 1-.8 7.4Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 18.6a4.4 4.4 0 0 1 .5-8.8 5.8 5.8 0 0 1 11.1 1.4 3.8 3.8 0 0 1-.8 7.4Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E");
  animation: rlFogDrift 6.8s ease-in-out infinite;
}

.rlmain .rlwx[w="wind"]::before {
  background-color: var(--rl-nature);
  filter: drop-shadow(0 0 5px rgba(61, 220, 151, .6));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9.6h11.4a2.7 2.7 0 1 0-2.7-2.7M3 14.4h15a2.7 2.7 0 1 1-2.7 2.7M3 12h6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9.6h11.4a2.7 2.7 0 1 0-2.7-2.7M3 14.4h15a2.7 2.7 0 1 1-2.7 2.7M3 12h6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  animation: rlWindPush 2.4s ease-in-out infinite;
}

@keyframes rlWindPush {
  0%, 100% { transform: translateX(-2px); opacity: .7; }
  55% { transform: translateX(2px); opacity: 1; }
}

.rlmain .rlwx[w="void"]::before {
  background-color: var(--rl-chaos);
  filter: drop-shadow(0 0 8px rgba(255, 45, 85, .8));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='3.4' fill='black'/%3E%3Cpath d='M12 3.6v2.4M12 18v2.4M3.6 12h2.4M18 12h2.4' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='3.4' fill='black'/%3E%3Cpath d='M12 3.6v2.4M12 18v2.4M3.6 12h2.4M18 12h2.4' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
  animation: rlVoidPulse 2.6s ease-in-out infinite;
}

@keyframes rlVoidPulse {
  0%, 100% { transform: scale(.9); opacity: .7; }
  50% { transform: scale(1.08); opacity: 1; }
}

@keyframes rlBreath {
  0%, 100% { opacity: .68; }
  50% { opacity: 1; }
}

/* ---------- 危险度指示 ---------- */
.rlmain .rldg {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px 7px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  border: 1px solid;
  border-radius: 2px;
}

.rlmain .rldg::before {
  content: '';
  width: 12px;
  height: 12px;
  margin-right: 3px;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4 22 20.4H2Z' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M12 8.4v5.4M12 16.4v1.4' stroke='black' stroke-width='2.1' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4 22 20.4H2Z' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M12 8.4v5.4M12 16.4v1.4' stroke='black' stroke-width='2.1' stroke-linecap='round'/%3E%3C/svg%3E");
  -webkit-mask-size: 12px 12px;
  mask-size: 12px 12px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-color: currentColor;
}

.rlmain .rldg[dg="1"] { color: var(--rl-nature); border-color: rgba(61, 220, 151, .45); background: rgba(61, 220, 151, .09); }
.rlmain .rldg[dg="1"]::after { content: '★'; }
.rlmain .rldg[dg="2"] { color: #9ddc3d; border-color: rgba(157, 220, 61, .45); background: rgba(157, 220, 61, .09); }
.rlmain .rldg[dg="2"]::after { content: '★★'; }
.rlmain .rldg[dg="3"] { color: var(--rl-gold); border-color: rgba(255, 201, 77, .5); background: rgba(255, 201, 77, .1); box-shadow: 0 0 4px rgba(255, 201, 77, .35); }
.rlmain .rldg[dg="3"]::after { content: '★★★'; }
.rlmain .rldg[dg="4"] { color: #ff8a3d; border-color: rgba(255, 138, 61, .55); background: rgba(255, 138, 61, .12); box-shadow: 0 0 10px rgba(255, 138, 61, .45), 0 0 20px rgba(255, 138, 61, .18); }
.rlmain .rldg[dg="4"]::after { content: '★★★★'; }
.rlmain .rldg[dg="5"] { color: var(--rl-chaos); border-color: rgba(255, 45, 85, .6); background: rgba(255, 45, 85, .14); box-shadow: 0 0 8px rgba(255, 45, 85, .6), 0 0 24px rgba(255, 45, 85, .3), 0 0 48px rgba(255, 45, 85, .12); animation: rlBreath 1.3s ease-in-out infinite; }
.rlmain .rldg[dg="5"]::after { content: '★★★★★'; }
.rlmain .rldg[dg="6"] { color: var(--rl-gold-d); border-color: rgba(201, 162, 39, .65); background: rgba(201, 162, 39, .16); box-shadow: 0 0 10px rgba(201, 162, 39, .7), 0 0 28px rgba(201, 162, 39, .4), 0 0 56px rgba(201, 162, 39, .18); animation: rlBreath 0.8s ease-in-out infinite; }
.rlmain .rldg[dg="6"]::after { content: '★★★★★★'; }

/* rlcap 与 rldg 并列时间距 */
.rlmain .rlcap + .rldg { margin-left: 2px; }
.rlmain .rldg + .rlcap { margin-left: 5px; }

/* ---------- 设置按钮 ---------- */
.rlmain .rlsetbtn {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 38px;
  height: 38px;
  margin-left: 8px;
  cursor: pointer;
  background: linear-gradient(145deg, rgba(34, 48, 82, .8), rgba(14, 18, 32, .9));
  border: 1px solid var(--rl-line2);
  border-radius: 2px;
  transition: border-color .18s ease-out, background .18s ease-out, transform .18s var(--rl-ez-pop);
  -webkit-tap-highlight-color: transparent;
}

.rlmain .rlsetbtn::before {
  content: '';
  width: 20px;
  height: 20px;
  background-color: var(--rl-txt2);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.3a3.3 3.3 0 1 0 0-6.6 3.3 3.3 0 0 0 0 6.6Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M19.5 12c0-.5-.05-1-.14-1.47l2.02-1.44-1.9-3.3-2.32.9a7.6 7.6 0 0 0-2.55-1.48L14.3 2.7h-3.8l-.31 2.51a7.6 7.6 0 0 0-2.55 1.48l-2.32-.9-1.9 3.3 2.02 1.44a7.9 7.9 0 0 0 0 2.94L3.42 14.9l1.9 3.3 2.32-.9a7.6 7.6 0 0 0 2.55 1.48l.31 2.51h3.8l.31-2.51a7.6 7.6 0 0 0 2.55-1.48l2.32.9 1.9-3.3-2.02-1.44c.09-.47.14-.96.14-1.46Z' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.3a3.3 3.3 0 1 0 0-6.6 3.3 3.3 0 0 0 0 6.6Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M19.5 12c0-.5-.05-1-.14-1.47l2.02-1.44-1.9-3.3-2.32.9a7.6 7.6 0 0 0-2.55-1.48L14.3 2.7h-3.8l-.31 2.51a7.6 7.6 0 0 0-2.55 1.48l-2.32-.9-1.9 3.3 2.02 1.44a7.9 7.9 0 0 0 0 2.94L3.42 14.9l1.9 3.3 2.32-.9a7.6 7.6 0 0 0 2.55 1.48l.31 2.51h3.8l.31-2.51a7.6 7.6 0 0 0 2.55-1.48l2.32.9 1.9-3.3-2.02-1.44c.09-.47.14-.96.14-1.46Z' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
  -webkit-mask-size: 20px 20px;
  mask-size: 20px 20px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: background-color .18s ease-out, filter .18s ease-out;
}

.rlmain .rlsetbtn:hover {
  background: linear-gradient(145deg, rgba(77, 208, 255, .22), rgba(14, 18, 32, .9));
  border-color: var(--rl-order);
  transform: scale(1.06);
}

.rlmain .rlsetbtn:hover::before {
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 7px rgba(77, 208, 255, .9));
  animation: rlSpin 4s linear infinite;
}

.rlmain .rlsetbtn:active {
  transform: scale(.94);
}

/* 设置按钮悬浮提示 */
.rlmain .rlsetbtn::after {
  content: 'SYSTEM';
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 7px;
  padding: 3px 8px;
  font-size: 9px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: 1.5px;
  white-space: nowrap;
  background: rgba(8, 10, 16, .96);
  border: 1px solid var(--rl-order-d);
  border-radius: 2px;
  opacity: 0;
  transform: translateY(-5px);
  pointer-events: none;
  transition: opacity .2s ease-out, transform .2s ease-out;
  z-index: 20;
}

.rlmain .rlsetbtn:hover::after {
  opacity: 1;
  transform: translateY(0);
}

/* 设置面板打开时按钮变为激活态 —— 排除行动折叠开关 rlac2 */
.rlmain input.rlck.rlst2:checked ~ .rltop .rlsetbtn {
  background: linear-gradient(145deg, rgba(255, 45, 85, .28), rgba(14, 18, 32, .9));
  border-color: var(--rl-chaos);
}

.rlmain input.rlck.rlst2:checked ~ .rltop .rlsetbtn::before {
  background-color: var(--rl-chaos);
  filter: drop-shadow(0 0 8px rgba(255, 45, 85, .9));
  transform: rotate(90deg);
}

/* ============================================================
   3. 正文区 —— 固定高度可滚动
   ============================================================ */
.rlmain .rlbody {
  position: relative;
  z-index: 2;
  flex: 1 1 auto;
  min-height: 0;
  box-sizing: border-box;
  padding: 8px 18px 10px 30px;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  overscroll-behavior-y: contain;
  background:
    linear-gradient(180deg, var(--rl-order) 0%, rgba(77, 208, 255, .25) 40%, rgba(255, 45, 85, .3) 100%)12px 0/3px 100% no-repeat,
    repeating-linear-gradient(180deg, transparent 0 6px, rgba(8, 10, 16, .8) 6px 8px) 12px 0/3px 100% no-repeat,
    linear-gradient(180deg, rgba(20, 26, 44, .5) 0%, rgba(8, 10, 16, .2) 30%, rgba(8, 10, 16, 0) 100%);
  scrollbar-width: thin;
  scrollbar-color: var(--rl-line2) transparent;
  overscroll-behavior: contain;
}

.rlmain .rlbody p {
  margin: 0 0 13px;
  font-size: 13.5px;
  line-height: 1.92;
  color: var(--rl-txt);
  text-align: justify;
  text-indent: 1.6em;
  letter-spacing: .35px;
}

.rlmain .rlbody p:last-child {
  margin-bottom: 0;
}

/* 系统提示【】自动高亮 —— 通过 em 标签承载 */
.rlmain .rlbody em {
  display: inline-block;
  padding: 1px 7px;
  margin: 0 2px;
  font-style: normal;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rl-order);
  background: rgba(77, 208, 255, .1);
  border-left: 2px solid var(--rl-order);
  border-radius: 0 2px 2px 0;
  text-shadow: 0 0 6px rgba(77, 208, 255, .45);
}

/* 空段落与多余换行兜底 —— 正文只用p，br与空p一律无效 */
.rlmain .rlbody p:empty { display: none; }
.rlmain .rlbody p:has(> br:only-child) { display: none; }
.rlmain .rlbody br { display: none; }

/* 整段被em包裹时改为块级，避免inline-block行盒留白 */
.rlmain .rlbody p:has(> em:only-child) { text-indent: 0; }
.rlmain .rlbody p > em:only-child { display: block; margin: 0; }

/* 正文区内出现非法块级元素时，剥掉BFC与浮动影响 */
.rlmain .rlbody > div,
.rlmain .rlbody > details,
.rlmain .rlbody > blockquote,
.rlmain .rlbody > table { float: none; clear: none; overflow: visible; margin: 0 0 13px; }

/* 对话强调 */
.rlmain .rlbody q {
  quotes: none;
  color: #e4ecfa;
  font-weight: 500;
}

.rlmain .rlbody q::before,
.rlmain .rlbody q::after {
  color: var(--rl-gold);
  content: '「';
}

.rlmain .rlbody q::after {
  content: '」';
}

/* 技能名突出 */
.rlmain .rlbody strong {
  color: var(--rl-gold);
  font-weight: 700;
  text-shadow: 0 0 7px rgba(255, 201, 77, .5);
}

/* 正文尾部终端光标收束 */
.rlmain .rlbody::after {
  content: '';
  display: block;
  clear: both;
  width: 100%;
  height: 26px;
  margin-top: 6px;
  background:
    linear-gradient(90deg, rgba(77, 208, 255, .5), rgba(77, 208, 255, 0) 42%) 0 50%/100% 1px no-repeat;
}

/* 滚动条 —— webkit */
.rlmain .rlbody::-webkit-scrollbar {
  width: 7px;
}

.rlmain .rlbody::-webkit-scrollbar-track {
  background: rgba(8, 10, 16, .55);
  border-left: 1px solid rgba(34, 48, 82, .55);
}

.rlmain .rlbody::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--rl-order-d), var(--rl-line2));
  border-radius: 0;
  box-shadow: inset 0 0 3px rgba(77, 208, 255, .5);
}

.rlmain .rlbody::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, var(--rl-order), var(--rl-order-d));
}

/* ============================================================
   4. 导航按钮组 —— 六个 SVG 图标按钮
   ============================================================ */
.rlmain .rlnavbar {
  position: relative;
  z-index: 25;
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: repeat(6, 1fr);
  gap: 1px;
  box-sizing: border-box;
  height: 58px;
  padding: 0;
  background: var(--rl-line);
  border-top: 1px solid var(--rl-line2);
  border-bottom: 1px solid var(--rl-line2);
  box-shadow: 0 -6px 20px rgba(0, 0, 0, .5), 0 6px 20px rgba(0, 0, 0, .5);
}

.rlmain .rlbtn {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  box-sizing: border-box;
  padding: 5px 2px 6px;
  overflow: hidden;
  cursor: pointer;
  background: linear-gradient(180deg, rgba(20, 26, 44, .96), rgba(10, 13, 22, .98));
  transition: background .2s ease-out;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}

/* 按钮内部斜向光泽 */
.rlmain .rlbtn::before {
  content: '';
  position: absolute;
  top: -60%;
  left: -120%;
  width: 60%;
  height: 220%;
  background: linear-gradient(90deg, transparent, rgba(180, 220, 255, .13), transparent);
  transform: rotate(22deg);
  transition: left .5s var(--rl-ez-panel);
  pointer-events: none;
}

.rlmain .rlbtn:hover::before {
  left: 160%;
}

/* 按钮底部激活光条 */
.rlmain .rlbtn::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--rl-order), transparent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .38s var(--rl-ez-pop);
  filter: drop-shadow(0 0 5px rgba(77, 208, 255, .9));
}

.rlmain .rlbtn i {
  position: relative;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  background-color: var(--rl-txt3);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 20px 20px;
  mask-size: 20px 20px;
  transition: background-color .2s ease-out, transform .28s var(--rl-ez-pop), filter .2s ease-out;
}

.rlmain .rlbtn span {
  font-size: 9px;
  font-weight: 600;
  color: var(--rl-txt3);
  letter-spacing: .4px;
  white-space: nowrap;
  transition: color .2s ease-out, text-shadow .2s ease-out;
}

.rlmain .rlbtn:hover {
  background: linear-gradient(180deg, rgba(34, 48, 82, .95), rgba(14, 18, 32, .98));
}

.rlmain .rlbtn:hover i {
  background-color: var(--rl-txt);
  transform: translateY(-1px) scale(1.06);
}

.rlmain .rlbtn:hover span {
  color: var(--rl-txt);
}

.rlmain .rlbtn:active i {
  transform: translateY(0) scale(.92);
}

/* ---------- 六个导航图标 ---------- */
/* 0 主角信息 —— 人形+六芒环 */
.rlmain .rlbtn.rlb0 i {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.6' r='3.6' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.2 21c0-3.8 3-6.5 6.8-6.5s6.8 2.7 6.8 6.5' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M12 1.4l1.6 2.4h-3.2Z' fill='black'/%3E%3Cpath d='M2.6 10.6l1.8 1.4-1.8 1.4ZM21.4 10.6l-1.8 1.4 1.8 1.4Z' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.6' r='3.6' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.2 21c0-3.8 3-6.5 6.8-6.5s6.8 2.7 6.8 6.5' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M12 1.4l1.6 2.4h-3.2Z' fill='black'/%3E%3Cpath d='M2.6 10.6l1.8 1.4-1.8 1.4ZM21.4 10.6l-1.8 1.4 1.8 1.4Z' fill='black'/%3E%3C/svg%3E");
}

/* 1 互动角色 —— 双人对话 */
.rlmain .rlbtn.rlb1 i {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='8.2' cy='7.4' r='3.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M2.4 19.8c0-3.3 2.6-5.6 5.8-5.6s5.8 2.3 5.8 5.6' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M15.6 4.4a3.2 3.2 0 0 1 0 6.2M16.4 14.4c2.9.3 5.2 2.6 5.2 5.4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3Cpath d='M11.4 2.8h6.8v3.4h-2.2l-1.6 1.8V6.2h-3Z' fill='black' opacity='.85'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='8.2' cy='7.4' r='3.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M2.4 19.8c0-3.3 2.6-5.6 5.8-5.6s5.8 2.3 5.8 5.6' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M15.6 4.4a3.2 3.2 0 0 1 0 6.2M16.4 14.4c2.9.3 5.2 2.6 5.2 5.4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3Cpath d='M11.4 2.8h6.8v3.4h-2.2l-1.6 1.8V6.2h-3Z' fill='black' opacity='.85'/%3E%3C/svg%3E");
}

/* 2 世界联络平台 —— 卫星信号塔 */
.rlmain .rlbtn.rlb2 i {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='2.4' fill='black'/%3E%3Cpath d='M7.6 7.6a6.2 6.2 0 0 0 0 8.8M16.4 7.6a6.2 6.2 0 0 1 0 8.8' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M4.6 4.6a10.4 10.4 0 0 0 0 14.8M19.4 4.6a10.4 10.4 0 0 1 0 14.8' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' opacity='.75'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='2.4' fill='black'/%3E%3Cpath d='M7.6 7.6a6.2 6.2 0 0 0 0 8.8M16.4 7.6a6.2 6.2 0 0 1 0 8.8' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M4.6 4.6a10.4 10.4 0 0 0 0 14.8M19.4 4.6a10.4 10.4 0 0 1 0 14.8' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' opacity='.75'/%3E%3C/svg%3E");
}

/* 3 地区与任务 —— 罗盘地图 */
.rlmain .rlbtn.rlb3 i {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5.8 9 3.4l6 2.4 6-2.4v14.8l-6 2.4-6-2.4-6 2.4Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9 3.4v15.4M15 5.8v15.4' stroke='black' stroke-width='1.3' opacity='.7'/%3E%3Ccircle cx='12' cy='11.6' r='2.2' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5.8 9 3.4l6 2.4 6-2.4v14.8l-6 2.4-6-2.4-6 2.4Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9 3.4v15.4M15 5.8v15.4' stroke='black' stroke-width='1.3' opacity='.7'/%3E%3Ccircle cx='12' cy='11.6' r='2.2' fill='black'/%3E%3C/svg%3E");
}

/* 4 关系网 —— 节点连线 */
.rlmain .rlbtn.rlb4 i {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5.4 5.4 9.6M12 5.4l6.6 4.2M5.4 9.6 8.6 18M18.6 9.6 15.4 18M8.6 18h6.8' stroke='black' stroke-width='1.4' opacity='.8'/%3E%3Ccircle cx='12' cy='4.6' r='2.4' fill='black'/%3E%3Ccircle cx='4.8' cy='10.2' r='1.9' fill='black'/%3E%3Ccircle cx='19.2' cy='10.2' r='1.9' fill='black'/%3E%3Ccircle cx='8.2' cy='19' r='1.7' fill='black'/%3E%3Ccircle cx='15.8' cy='19' r='1.7' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5.4 5.4 9.6M12 5.4l6.6 4.2M5.4 9.6 8.6 18M18.6 9.6 15.4 18M8.6 18h6.8' stroke='black' stroke-width='1.4' opacity='.8'/%3E%3Ccircle cx='12' cy='4.6' r='2.4' fill='black'/%3E%3Ccircle cx='4.8' cy='10.2' r='1.9' fill='black'/%3E%3Ccircle cx='19.2' cy='10.2' r='1.9' fill='black'/%3E%3Ccircle cx='8.2' cy='19' r='1.7' fill='black'/%3E%3Ccircle cx='15.8' cy='19' r='1.7' fill='black'/%3E%3C/svg%3E");
}

/* 5 过往记忆 —— 数据晶体 */
.rlmain .rlbtn.rlb5 i {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.2 20.4 7v10L12 21.8 3.6 17V7Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M12 2.2v19.6M3.6 7l8.4 4.8 8.4-4.8' stroke='black' stroke-width='1.3' opacity='.75'/%3E%3Ccircle cx='12' cy='11.9' r='1.7' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.2 20.4 7v10L12 21.8 3.6 17V7Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M12 2.2v19.6M3.6 7l8.4 4.8 8.4-4.8' stroke='black' stroke-width='1.3' opacity='.75'/%3E%3Ccircle cx='12' cy='11.9' r='1.7' fill='black'/%3E%3C/svg%3E");
}

/* ---------- 选中态：六路穷举 ---------- */
.rlmain input.rlrd.rlr0:checked ~ .rlnavbar .rlb0,
.rlmain input.rlrd.rlr1:checked ~ .rlnavbar .rlb1,
.rlmain input.rlrd.rlr2:checked ~ .rlnavbar .rlb2,
.rlmain input.rlrd.rlr3:checked ~ .rlnavbar .rlb3,
.rlmain input.rlrd.rlr4:checked ~ .rlnavbar .rlb4,
.rlmain input.rlrd.rlr5:checked ~ .rlnavbar .rlb5 {
  background: linear-gradient(180deg, rgba(77, 208, 255, .2) 0%, rgba(20, 30, 54, .98) 62%, rgba(14, 18, 32, .99) 100%);
}

.rlmain input.rlrd.rlr0:checked ~ .rlnavbar .rlb0 i,
.rlmain input.rlrd.rlr1:checked ~ .rlnavbar .rlb1 i,
.rlmain input.rlrd.rlr2:checked ~ .rlnavbar .rlb2 i,
.rlmain input.rlrd.rlr3:checked ~ .rlnavbar .rlb3 i,
.rlmain input.rlrd.rlr4:checked ~ .rlnavbar .rlb4 i,
.rlmain input.rlrd.rlr5:checked ~ .rlnavbar .rlb5 i {
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 8px rgba(77, 208, 255, .95));
  transform: translateY(-2px) scale(1.1);
  animation: rlIconBreath 2.6s ease-in-out infinite;
}

@keyframes rlIconBreath {
  0%, 100% { filter: drop-shadow(0 0 6px rgba(77, 208, 255, .7)); }
  50% { filter: drop-shadow(0 0 14px rgba(77, 208, 255, 1)); }
}

.rlmain input.rlrd.rlr0:checked ~ .rlnavbar .rlb0 span,
.rlmain input.rlrd.rlr1:checked ~ .rlnavbar .rlb1 span,
.rlmain input.rlrd.rlr2:checked ~ .rlnavbar .rlb2 span,
.rlmain input.rlrd.rlr3:checked ~ .rlnavbar .rlb3 span,
.rlmain input.rlrd.rlr4:checked ~ .rlnavbar .rlb4 span,
.rlmain input.rlrd.rlr5:checked ~ .rlnavbar .rlb5 span {
  color: var(--rl-order);
  text-shadow: 0 0 8px rgba(77, 208, 255, .6);
  font-weight: 700;
}

.rlmain input.rlrd.rlr0:checked ~ .rlnavbar .rlb0::after,
.rlmain input.rlrd.rlr1:checked ~ .rlnavbar .rlb1::after,
.rlmain input.rlrd.rlr2:checked ~ .rlnavbar .rlb2::after,
.rlmain input.rlrd.rlr3:checked ~ .rlnavbar .rlb3::after,
.rlmain input.rlrd.rlr4:checked ~ .rlnavbar .rlb4::after,
.rlmain input.rlrd.rlr5:checked ~ .rlnavbar .rlb5::after {
  transform: scaleX(1);
}

/* ============================================================
   6. 面板内通用组件库 —— 供后续内容设计直接复用
   ============================================================ */

/* 数据行 */
.rlmain .rlrow {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 5px 8px;
  margin: 0 0 3px;
  font-size: 12.5px;
  background: linear-gradient(90deg, rgba(28, 36, 64, .5), rgba(28, 36, 64, 0));
  border-left: 2px solid var(--rl-line2);
  transition: background .18s ease-out, border-color .18s ease-out, padding-left .18s ease-out;
}

.rlmain .rlrow:hover {
  background: linear-gradient(90deg, rgba(77, 208, 255, .13), rgba(28, 36, 64, 0));
  border-left-color: var(--rl-order);
  padding-left: 12px;
}

.rlmain .rlrow > b {
  flex: 0 0 auto;
  min-width: 62px;
  font-size: 11px;
  font-weight: 600;
  color: var(--rl-txt2);
  letter-spacing: .8px;
}

.rlmain .rlrow > span {
  flex: 1 1 auto;
  color: var(--rl-txt);
}

/* 数值强调 */
.rlmain .rlnum {
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 13px;
  font-weight: 700;
  color: var(--rl-order);
  text-shadow: 0 0 7px rgba(77, 208, 255, .5);
}

/* 标签芯片 */
.rlmain .rltag {
  display: inline-block;
  padding: 2px 8px;
  margin: 2px 3px 2px 0;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .6px;
  color: var(--rl-txt2);
  background: rgba(28, 36, 64, .8);
  border: 1px solid var(--rl-line2);
  border-radius: 2px;
  transition: color .18s ease-out, border-color .18s ease-out, box-shadow .18s ease-out, transform .18s var(--rl-ez-pop);
}

.rlmain .rltag:hover {
  color: var(--rl-order);
  border-color: var(--rl-order-d);
  box-shadow: 0 0 10px rgba(77, 208, 255, .45), 0 0 20px rgba(77, 208, 255, .18);
  transform: translateY(-1px);
}

/* ---------- 悬停 tooltip 组件 ----------
   用法：<b class="rlcap" q="3">技能名<i>品质·主动·冷却10·效果说明</i></b>
   长方形标签样式，悬停时展开 <i> 内的详情，离开自动收回 */
.rlmain .rlcap {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  max-width: 100%;
  padding: 2px 8px;
  margin: 2px 3px 2px 0;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .6px;
  color: var(--rl-txt2);
  white-space: nowrap;
  text-overflow: ellipsis;
  background: rgba(28, 36, 64, .8);
  border: 1px solid var(--rl-line2);
  border-radius: 2px;
  cursor: default;
  transition: color .18s ease-out, border-color .18s ease-out, box-shadow .18s ease-out, transform .18s var(--rl-ez-pop);
  -webkit-tap-highlight-color: transparent;
}

.rlmain .rlcap > i {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 99999;
  box-sizing: border-box;
  width: 320px;
  max-width: min(320px, calc(100cqw - 30px));
  margin-top: 6px;
  padding: 9px 11px;
  font: 400 10.5px/1.55 inherit;
  font-style: normal;
  color: var(--rl-txt);
  text-align: left;
  white-space: normal;
  letter-spacing: .2px;
  background: linear-gradient(160deg, rgba(12, 16, 28, .98), rgba(5, 7, 12, .99));
  border: 1px solid var(--rl-order-d);
  border-radius: 2px;
  box-shadow: 0 6px 22px rgba(0, 0, 0, .8), 0 0 0 1px rgba(77, 208, 255, .2), inset 0 1px 0 rgba(120, 180, 240, .12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px) scale(.96);
  pointer-events: none;
  transition: opacity .22s ease-out, transform .22s var(--rl-ez-pop), visibility .22s;
  max-height: none;
  overflow: visible;
}
.rlmain .rlcap > i::-webkit-scrollbar {
  width: 0;
  height: 0;
}

/* 小三角箭头 */
.rlmain .rlcap > i::before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 14px;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-bottom-color: var(--rl-order-d);
}

.rlmain .rlcap > i::after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 15px;
  width: 0;
  height: 0;
  border: 4px solid transparent;
  border-bottom-color: rgba(12, 16, 28, .98);
}

.rlmain .rlcap:hover {
  z-index: 9999;
  color: var(--rl-order);
  border-color: var(--rl-order-d);
  box-shadow: 0 0 10px rgba(77, 208, 255, .45), 0 0 20px rgba(77, 208, 255, .18);
  transform: translateY(-1px);
}

.rlmain .rlcap:hover > i {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

/* 悬停标签时提升所在行层级，确保 tooltip 不被相邻行遮挡 */
.rlmain .rlrow:has(.rlcap:hover) {
  z-index: 9000;
}

.rlmain .rlgrid2:has(.rlcap:hover),
.rlmain .rlgrid3:has(.rlcap:hover) {
  position: relative;
  z-index: 9000;
}

/* 标签内详情标题行（粗体） */
.rlmain .rlcap > i > b {
  display: block;
  margin-bottom: 3px;
  font-size: 11px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: .6px;
  text-shadow: 0 0 6px rgba(77, 208, 255, .5);
}

/* 标签内详情分隔线 */
.rlmain .rlcap > i > hr {
  height: 1px;
  margin: 4px 0;
  border: 0;
  background: linear-gradient(90deg, var(--rl-order-d), transparent);
}

/* 属性数值悬停（不改变数字显示，悬停显示效果说明） */
.rlmain .rlcap.rlcap-num,
.rlmain .rlcap.rlcap-num:hover {
  padding: 0;
  margin: 0;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
}

.rlmain .rlcap.rlcap-num > i {
  left: -4px;
}

/* ---------- 阵营色穷举 ---------- */
.rlmain [fc="order"] {
  color: var(--rl-order);
  border-color: rgba(77, 208, 255, .5);
  background: rgba(77, 208, 255, .1);
  text-shadow: 0 0 6px rgba(77, 208, 255, .45);
}

.rlmain [fc="chaos"] {
  color: var(--rl-chaos);
  border-color: rgba(255, 45, 85, .5);
  background: rgba(255, 45, 85, .1);
  text-shadow: 0 0 6px rgba(255, 45, 85, .5);
}

.rlmain [fc="nature"] {
  color: var(--rl-nature);
  border-color: rgba(61, 220, 151, .5);
  background: rgba(61, 220, 151, .1);
  text-shadow: 0 0 6px rgba(61, 220, 151, .45);
}

.rlmain [fc="none"] {
  color: var(--rl-txt2);
  border-color: var(--rl-line2);
  background: rgba(28, 36, 64, .6);
}

/* ---------- 品质色穷举 七级 ---------- */
.rlmain [q="1"] { color: #9aa8bd; border-color: rgba(154, 168, 189, .4); }
.rlmain [q="2"] { color: #5fd97a; border-color: rgba(95, 217, 122, .45); box-shadow: 0 0 4px rgba(95, 217, 122, .35); }
.rlmain [q="3"] { color: #4da6ff; border-color: rgba(77, 166, 255, .5); box-shadow: 0 0 4px rgba(77, 166, 255, .35); }
.rlmain [q="4"] { color: #b968ff; border-color: rgba(185, 104, 255, .5); box-shadow: 0 0 10px rgba(185, 104, 255, .45), 0 0 20px rgba(185, 104, 255, .18); }
.rlmain [q="5"] { color: var(--rl-gold); border-color: rgba(255, 201, 77, .55); box-shadow: 0 0 10px rgba(255, 201, 77, .45), 0 0 20px rgba(255, 201, 77, .18); }
.rlmain [q="6"] {
  color: #d8952a;
  border-color: rgba(216, 149, 42, .6);
  background: linear-gradient(90deg, rgba(216, 149, 42, .16), rgba(90, 55, 10, .08));
  box-shadow: 0 0 8px rgba(216, 149, 42, .6), 0 0 24px rgba(216, 149, 42, .3), 0 0 48px rgba(216, 149, 42, .12);
}
.rlmain [q="7"] {
  color: #ff5ce0;
  border-color: rgba(255, 92, 224, .65);
  background: linear-gradient(90deg, rgba(255, 92, 224, .18), rgba(77, 208, 255, .1));
  box-shadow: 0 0 8px rgba(255, 92, 224, .6), 0 0 24px rgba(255, 92, 224, .3), 0 0 48px rgba(255, 92, 224, .12);
  animation: rlEternal 3.4s ease-in-out infinite;
}

@keyframes rlEternal {
  0%, 100% { filter: hue-rotate(0deg); }
  50% { filter: hue-rotate(38deg); }
}

/* ---------- 卡片容器（切角 + drop-shadow 发光） ---------- */
.rlmain .rlcard {
  position: relative;
  box-sizing: border-box;
  padding: 11px 13px;
  margin: 0 0 9px;
  background: linear-gradient(150deg, rgba(28, 36, 64, .85), rgba(14, 18, 32, .92));
  border: 1px solid var(--rl-line2);
  clip-path: polygon(var(--rl-cut) 0, 100% 0, 100% calc(100% - var(--rl-cut)), calc(100% - var(--rl-cut)) 100%, 0 100%, 0 var(--rl-cut));
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .5));
  transition: border-color .2s ease-out, filter .25s ease-out, transform .25s var(--rl-ez-panel);
}

.rlmain .rlcard:hover {
  border-color: var(--rl-order-d);
  filter: drop-shadow(0 0 10px rgba(77, 208, 255, .35)) drop-shadow(0 3px 8px rgba(0, 0, 0, .55));
  transform: translateY(-2px);
}

/* 悬停标签时临时移除卡片切角裁剪，让 tooltip 能溢出显示 */
.rlmain .rlcard:has(.rlcap:hover) {
  position: relative;
  z-index: 100;
  clip-path: none;
}

/* 卡片右上角机械标记 */
.rlmain .rlcard::before {
  content: '';
  position: absolute;
  top: 6px;
  right: 8px;
  width: 16px;
  height: 8px;
  background:
    linear-gradient(90deg, var(--rl-order) 0 4px, transparent 4px 6px, var(--rl-order) 6px 10px, transparent 10px 12px, var(--rl-chaos) 12px 16px);
  opacity: .55;
}

/* 卡片左侧氛围竖光 */
.rlmain .rlcard::after {
  content: '';
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 2px;
  background: linear-gradient(180deg, var(--rl-order), transparent);
  opacity: 0;
  transition: opacity .25s ease-out;
}

.rlmain .rlcard:hover::after {
  opacity: 1;
}

/* 头像位 —— 纯 CSS 生成的占位纹样 */
.rlmain .rlava {
  position: relative;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  background:
    radial-gradient(circle at 50% 38%, rgba(77, 208, 255, .3), transparent 62%),
    linear-gradient(145deg, rgba(34, 48, 82, .95), rgba(8, 10, 16, .98));
  border: 1px solid var(--rl-line2);
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  transition: filter .25s ease-out;
}

.rlmain .rlava::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--rl-order);
  opacity: .75;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='9' r='3.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.6 20c0-3.6 2.9-6.2 6.4-6.2s6.4 2.6 6.4 6.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='9' r='3.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.6 20c0-3.6 2.9-6.2 6.4-6.2s6.4 2.6 6.4 6.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
  -webkit-mask-size: 30px 30px;
  mask-size: 30px 30px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.rlmain .rlcard:hover .rlava {
  filter: drop-shadow(0 0 8px rgba(77, 208, 255, .6));
}

/* 锁定标记 */
.rlmain .rllock {
  display: inline-block;
  width: 13px;
  height: 13px;
  vertical-align: -2px;
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 5px rgba(255, 201, 77, .8));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='5' y='10.4' width='14' height='10.4' rx='1.4' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M8.4 10.4V7.8a3.6 3.6 0 0 1 7.2 0v2.6' fill='none' stroke='black' stroke-width='1.7'/%3E%3Ccircle cx='12' cy='15.4' r='1.3' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='5' y='10.4' width='14' height='10.4' rx='1.4' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M8.4 10.4V7.8a3.6 3.6 0 0 1 7.2 0v2.6' fill='none' stroke='black' stroke-width='1.7'/%3E%3Ccircle cx='12' cy='15.4' r='1.3' fill='black'/%3E%3C/svg%3E");
  -webkit-mask-size: 13px 13px;
  mask-size: 13px 13px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  animation: rlBreath 2.8s ease-in-out infinite;
}

/* 分隔纹饰 */
.rlmain .rldiv {
  display: block;
  height: 9px;
  margin: 10px 0;
  border: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='9' viewBox='0 0 120 9'%3E%3Cpath d='M0 4.5h44M76 4.5h44' stroke='%23223052' stroke-width='1'/%3E%3Cpath d='M60 .8l5.4 3.7L60 8.2l-5.4-3.7Z' fill='none' stroke='%234dd0ff' stroke-width='1'/%3E%3Cpath d='M50 4.5h2.4M67.6 4.5H70' stroke='%23ffc94d' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 9px;
  opacity: .8;
}

/* ---------- 弹幕拖动组件 ---------- */
.rlmain .rldmbox {
  position: relative;
  box-sizing: border-box;
  height: 200px;
  margin: 6px 0 2px;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scroll-behavior: smooth;
  background:
    linear-gradient(180deg, rgba(5, 7, 12, .96) 0%, rgba(8, 10, 16, .7) 15%, rgba(8, 10, 16, .7) 85%, rgba(5, 7, 12, .96) 100%),
    linear-gradient(90deg, rgba(34, 48, 82, .25), rgba(14, 18, 32, .15));
  border: 1px solid var(--rl-line);
  border-radius: 2px;
  scrollbar-width: thin;
  scrollbar-color: var(--rl-line2) transparent;
  cursor: default;
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
}

/* WebKit 滚动条 */
.rlmain .rldmbox::-webkit-scrollbar {
  width: 4px;
}

.rlmain .rldmbox::-webkit-scrollbar-track {
  background: transparent;
}

.rlmain .rldmbox::-webkit-scrollbar-thumb {
  background: var(--rl-line2);
  border-radius: 2px;
}

.rlmain .rldmbox::-webkit-scrollbar-thumb:hover {
  background: var(--rl-order-d);
}

/* 弹幕列表容器 —— 静态布局，靠父级滚动 */
.rlmain .rldmlist {
  position: relative;
  padding: 6px 10px;
}

/* 单条弹幕 */
.rlmain .rldm {
  display: flex;
  align-items: baseline;
  gap: 7px;
  padding: 4px 0;
  font-size: 11.5px;
  line-height: 1.5;
  border-bottom: 1px dashed rgba(34, 48, 82, .4);
}

.rlmain .rldm:last-child {
  border-bottom: 0;
}

.rlmain .rldm > .rltag {
  flex: 0 0 auto;
  min-width: 48px;
  padding: 1px 6px;
  font-size: 10px;
  text-align: center;
}

.rlmain .rldm > span {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--rl-txt);
  word-break: break-word;
  white-space: normal;
}

/* ============================================================
   7. 设置面板 —— 侧滑覆盖层
   ============================================================ */
.rlmain .rlmask {
  position: absolute;
  inset: 0;
  z-index: 30;
  background: rgba(3, 5, 9, .74);
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
  transition: opacity .4s ease-out, visibility .4s;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.rlmain input.rlck.rlst2:checked ~ .rlmask {
  opacity: 1;
  visibility: visible;
}

.rlmain .rlsetpanel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 31;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 78%;
  max-width: 330px;
  padding: 0;
  overflow: hidden;
  background:
    linear-gradient(200deg, rgba(28, 36, 64, .97) 0%, rgba(12, 16, 28, .99) 55%, rgba(5, 7, 12, .99) 100%);
  border-left: 1px solid var(--rl-order-d);
  box-shadow: -14px 0 40px rgba(0, 0, 0, .78), inset 1px 0 0 rgba(77, 208, 255, .22);
  transform: translateX(103%);
  transition: transform .5s var(--rl-ez-slide);
}

.rlmain input.rlck.rlst2:checked ~ .rlsetpanel {
  transform: translateX(0);
}

/* 设置面板左缘能量流 */
.rlmain .rlsetpanel::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 40%;
  background: linear-gradient(180deg, transparent, var(--rl-order), var(--rl-gold), transparent);
  filter: drop-shadow(0 0 6px rgba(77, 208, 255, .9));
  animation: rlScanY 3.8s linear infinite;
}

@keyframes rlScanY {
  0% { transform: translateY(-105%); }
  100% { transform: translateY(355%); }
}

/* 设置面板背景网格 */
.rlmain .rlsetpanel::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .3;
  background-image:
    linear-gradient(rgba(34, 48, 82, .55) 1px, transparent 1px),
    linear-gradient(90deg, rgba(34, 48, 82, .55) 1px, transparent 1px);
  background-size: 26px 26px;
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 70% 20%, #000, transparent 78%);
  mask-image: radial-gradient(ellipse 90% 70% at 70% 20%, #000, transparent 78%);
}

/* 设置面板标题栏 */
.rlmain .rlsethd {
  position: relative;
  z-index: 2;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
  box-sizing: border-box;
  height: 56px;
  padding: 0 12px 0 15px;
  background: linear-gradient(180deg, rgba(34, 48, 82, .9), rgba(14, 18, 32, .95));
  border-bottom: 1px solid var(--rl-order-d);
}

.rlmain .rlsethd > i {
  flex: 0 0 auto;
  width: 19px;
  height: 19px;
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 6px rgba(77, 208, 255, .8));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3.2' y='4.4' width='17.6' height='15.2' rx='1.6' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M3.2 8.6h17.6' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='6.4' cy='6.5' r='.8' fill='black'/%3E%3Ccircle cx='9' cy='6.5' r='.8' fill='black'/%3E%3Cpath d='M6.8 12.4h10.4M6.8 15.8h6.6' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3.2' y='4.4' width='17.6' height='15.2' rx='1.6' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M3.2 8.6h17.6' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='6.4' cy='6.5' r='.8' fill='black'/%3E%3Ccircle cx='9' cy='6.5' r='.8' fill='black'/%3E%3Cpath d='M6.8 12.4h10.4M6.8 15.8h6.6' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  -webkit-mask-size: 19px 19px;
  mask-size: 19px 19px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.rlmain .rlsethd > b {
  flex: 1 1 auto;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: 2.4px;
  text-transform: uppercase;
  text-shadow: 0 0 9px rgba(77, 208, 255, .55);
}

/* 关闭按钮 */
.rlmain .rlclose {
  position: relative;
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  cursor: pointer;
  background: rgba(255, 45, 85, .1);
  border: 1px solid rgba(255, 45, 85, .38);
  border-radius: 2px;
  transition: background .18s ease-out, border-color .18s ease-out, transform .2s var(--rl-ez-pop);
  -webkit-tap-highlight-color: transparent;
}

.rlmain .rlclose::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--rl-chaos);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 6.4l11.2 11.2M17.6 6.4L6.4 17.6' stroke='black' stroke-width='2.1' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 6.4l11.2 11.2M17.6 6.4L6.4 17.6' stroke='black' stroke-width='2.1' stroke-linecap='round'/%3E%3C/svg%3E");
  -webkit-mask-size: 17px 17px;
  mask-size: 17px 17px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: transform .25s var(--rl-ez-pop);
}

.rlmain .rlclose:hover {
  background: rgba(255, 45, 85, .24);
  border-color: var(--rl-chaos);
  transform: rotate(90deg);
}

.rlmain .rlclose:hover::before {
  filter: drop-shadow(0 0 7px rgba(255, 45, 85, .95));
}

.rlmain .rlclose:active {
  transform: rotate(90deg) scale(.9);
}

/* 设置面板内容区 */
.rlmain .rlsetbd {
  position: relative;
  z-index: 2;
  flex: 1 1 auto;
  min-height: 0;
  box-sizing: border-box;
  padding: 14px 14px 20px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--rl-order-d) transparent;
  overscroll-behavior: contain;
}

.rlmain .rlsetbd::-webkit-scrollbar {
  width: 6px;
}

.rlmain .rlsetbd::-webkit-scrollbar-track {
  background: rgba(5, 7, 12, .6);
}

.rlmain .rlsetbd::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--rl-order-d), var(--rl-line2));
}

/* 设置分组标题 */
.rlmain .rlsetgrp {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 14px 0 8px;
  font-size: 10px;
  font-weight: 700;
  color: var(--rl-txt3);
  letter-spacing: 2px;
  text-transform: uppercase;
}

.rlmain .rlsetgrp:first-child {
  margin-top: 2px;
}

.rlmain .rlsetgrp::after {
  content: '';
  flex: 1 1 auto;
  height: 1px;
  background: linear-gradient(90deg, var(--rl-line2), transparent);
}

/* 设置条目 */
.rlmain .rlsetitem {
  display: flex;
  align-items: center;
  gap: 10px;
  box-sizing: border-box;
  padding: 9px 11px;
  margin: 0 0 6px;
  background: linear-gradient(140deg, rgba(28, 36, 64, .72), rgba(14, 18, 32, .8));
  border: 1px solid var(--rl-line);
  border-radius: 2px;
  transition: border-color .2s ease-out, background .2s ease-out, transform .2s var(--rl-ez-panel);
}

.rlmain .rlsetitem:hover {
  background: linear-gradient(140deg, rgba(77, 208, 255, .13), rgba(14, 18, 32, .85));
  border-color: var(--rl-order-d);
  transform: translateX(3px);
}

.rlmain .rlsetitem > u {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  text-decoration: none;
}

.rlmain .rlsetitem > u > b {
  font-size: 12px;
  font-weight: 600;
  color: var(--rl-txt);
}

.rlmain .rlsetitem > u > s {
  font-size: 10px;
  color: var(--rl-txt3);
  text-decoration: none;
  line-height: 1.5;
}

/* 设置项右侧数值/开关外观 */
.rlmain .rlsetval {
  flex: 0 0 auto;
  padding: 3px 9px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 11px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: .8px;
  background: rgba(77, 208, 255, .1);
  border: 1px solid var(--rl-order-d);
  border-radius: 2px;
  white-space: nowrap;
  transition: box-shadow .2s ease-out;
}

.rlmain .rlsetitem:hover .rlsetval {
  box-shadow: 0 0 10px rgba(77, 208, 255, .45), 0 0 20px rgba(77, 208, 255, .18);
}

.rlmain .rlsetval[v="off"] {
  color: var(--rl-txt3);
  background: rgba(28, 36, 64, .8);
  border-color: var(--rl-line2);
}

.rlmain .rlsetval[v="on"] {
  color: var(--rl-nature);
  background: rgba(61, 220, 151, .12);
  border-color: rgba(61, 220, 151, .5);
}

/* Story区内容直显（放大说明文字·支持换行） */
.rlmain .rlsetitem.rlsetstory > u > s {
  font-size: 11.5px;
  color: var(--rl-txt2);
  line-height: 1.6;
  white-space: normal;
  word-break: break-word;
}

/* 自由开放模式下隐藏 Story 区（剧情模式才显示章节信息） */
.rlmain .rlsetitem.rlmode-free ~ .rlsetgrp,
.rlmain .rlsetitem.rlmode-free ~ .rlsetitem.rlsetstory {
  display: none;
}

/* 设置项图标穷举 */
.rlmain .rlseti {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  background-color: var(--rl-txt2);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 18px 18px;
  mask-size: 18px 18px;
  transition: background-color .2s ease-out, filter .2s ease-out;
}

.rlmain .rlsetitem:hover .rlseti {
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 6px rgba(77, 208, 255, .8));
}

.rlmain .rlseti[s="style"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 20l3-8 8-8 5 5-8 8Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M13.4 5.4l5.2 5.2' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 20l3-8 8-8 5 5-8 8Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M13.4 5.4l5.2 5.2' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
}

.rlmain .rlseti[s="len"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6.4h18M3 12h13M3 17.6h8' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6.4h18M3 12h13M3 17.6h8' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
}

.rlmain .rlseti[s="mode"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.5 8h11a4 4 0 0 1 4 4v1.2a3.6 3.6 0 0 1-6.6 1.9 2.4 2.4 0 0 0-3.8 0A3.6 3.6 0 0 1 4.5 13.2V12a4 4 0 0 1 4-4Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M7.5 11.5v2M6.5 12.5h2' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3Ccircle cx='15.5' cy='11.6' r='.9' fill='black'/%3E%3Ccircle cx='17.6' cy='13' r='.9' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.5 8h11a4 4 0 0 1 4 4v1.2a3.6 3.6 0 0 1-6.6 1.9 2.4 2.4 0 0 0-3.8 0A3.6 3.6 0 0 1 4.5 13.2V12a4 4 0 0 1 4-4Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M7.5 11.5v2M6.5 12.5h2' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3Ccircle cx='15.5' cy='11.6' r='.9' fill='black'/%3E%3Ccircle cx='17.6' cy='13' r='.9' fill='black'/%3E%3C/svg%3E");
}

.rlmain .rlseti[s="info"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9.2' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M12 10.6v6' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='7.4' r='1.1' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9.2' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M12 10.6v6' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='7.4' r='1.1' fill='black'/%3E%3C/svg%3E");
}

.rlmain .rlseti[s="chapter"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 4.5h14v15H5Z' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M8 8.5h8M8 12h8M8 15.5h5' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 4.5h14v15H5Z' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M8 8.5h8M8 12h8M8 15.5h5' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.rlmain .rlseti[s="npc"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.5' r='3.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.4 20.4c0-3.6 3-6.4 6.6-6.4s6.6 2.8 6.6 6.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.5' r='3.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.4 20.4c0-3.6 3-6.4 6.6-6.4s6.6 2.8 6.6 6.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
}

.rlmain .rlseti[s="timeline"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M12 7v5l3.5 2' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M12 7v5l3.5 2' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
}

.rlmain .rlseti[s="next"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3Cpath d='M13 6l6 6-6 6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3Cpath d='M13 6l6 6-6 6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* 设置面板底部签名 */
.rlmain .rlsetft {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  padding: 9px 14px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 9px;
  color: var(--rl-txt3);
  letter-spacing: 1.6px;
  text-align: center;
  background: rgba(5, 7, 12, .8);
  border-top: 1px solid var(--rl-line);
}

/* ============================================================
   8. 容器查询自适应 —— 窄屏收缩策略
   ============================================================ */

@container rlbox (max-width: 460px) {
  .rlmain .rlbtn span {
    font-size: 9px;
    letter-spacing: 0;
  }
  .rlmain .rlbtn i {
    width: 22px;
    height: 22px;
    -webkit-mask-size: 22px 22px;
    mask-size: 22px 22px;
  }
  .rlmain .rlslot {
    padding: 0 9px;
  }
  .rlmain .rlslot > u > s {
    display: none;
  }
  .rlmain .rlnavbar {
    height: 66px;
  }
  .rlmain .rlactbd {
  box-sizing: border-box;
  max-height: 168px;
  padding: 0 11px 9px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--rl-line2) transparent;
  transition: max-height .34s cubic-bezier(.4, 0, .2, 1),
              padding .34s cubic-bezier(.4, 0, .2, 1);
}
  .rlmain .rlaci > span {
    font-size: 11.5px;
    line-height: 1.55;
  }
  .rlmain .rlsthd {
    height: 40px;
    padding-left: 11px;
  }
  .rlmain .rlstclose::after {
    display: none;
  }
  .rlmain .rlstclose {
    width: 30px;
    padding: 0;
    justify-content: center;
  }
}

@container rlbox (max-width: 350px) {
  .rlmain .rlbtn span {
    display: none;
  }
  .rlmain .rlbtn i {
    width: 24px;
    height: 24px;
    -webkit-mask-size: 24px 24px;
    mask-size: 24px 24px;
  }
  .rlmain .rlnavbar {
    height: 54px;
  }
  .rlmain .rlsigil {
    width: 46px;
  }
  .rlmain .rlslot.rlwrap {
    display: none;
  }
  .rlmain .rlacthd > b::before {
    content: '行动建议';
  }
  .rlmain .rlactbd {
    max-height: 280px;
    overflow-y: auto;
  }
  .rlmain .rlpn {
    padding: 11px 11px 18px;
  }
  .rlmain .rlgrid2,
  .rlmain .rlgrid3 {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* 媒体查询兜底 —— 容器查询不支持时的降级 */
@media (max-width: 420px) {
  .rlmain {
    height: calc(100vh - 152px);
    height: calc(100dvh - 152px);
    min-height: 430px;
    max-height: none;
    font-size: 12.5px;
    margin: 1px0;
  }
  .rlmain .rlbody {
    padding: 13px 13px 18px 24px;
  }
  .rlmain .rlbody p {
    font-size: 13px;
    line-height: 1.85;
  }

  .rlmain .rlsetpanel {
    width: auto;
    max-width: 90%;}

  .rlmain .rlactbd {
    max-height: 280px;
    overflow-y: auto;
  }
}

@media (max-width: 420px) {
  .rlmain .rlactbd {
    max-height: 140px;
    overflow-y: auto;
  }
  .rlmain .rlaci {
    padding: 5px 8px 5px 7px;
  }
}

/* 减弱动画偏好 */
@media (prefers-reduced-motion: reduce) {
  .rlmain *,
  .rlmain *::before,
  .rlmain *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


/* ============================================================
   9. 【重构】阅读区容器 —— 面板覆盖式布局的定位基准
   ============================================================ */
.rlmain .rlview {
  position: relative;
  flex: 1 1 auto;
  min-height: 220px;
  display: flex;
  flex-direction: column;
  overflow: visible;
}

/* 正文改为 rlview 的子项，保留原有内部样式 */
.rlmain .rlview > .rlbody {
  flex: 1 1 auto;
  min-height: 0;
}

/* ============================================================
   10. 【重构】面板舞台 —— 绝对定位覆盖层，独占阅读区全高
   ============================================================ */
.rlmain .rlstage {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  background:
    radial-gradient(ellipse 100% 60% at 50% 0%, rgba(77, 208, 255, .1), transparent 66%),
    linear-gradient(178deg, rgba(16, 21, 36, .995) 0%, rgba(9, 12, 21, .998) 60%, rgba(5, 7, 12, 1) 100%);
  opacity: 0;
  visibility: hidden;
  transform: translateY(16px);
  pointer-events: none;
  transition:
    opacity .26s ease-in,
    transform .26s ease-in,
    visibility .26s;
}

/* 七路穷举：任一面板 radio 选中即展开舞台 */
.rlmain input.rlrd.rlr0:checked ~ .rlview .rlstage,
.rlmain input.rlrd.rlr1:checked ~ .rlview .rlstage,
.rlmain input.rlrd.rlr2:checked ~ .rlview .rlstage,
.rlmain input.rlrd.rlr3:checked ~ .rlview .rlstage,
.rlmain input.rlrd.rlr4:checked ~ .rlview .rlstage,
.rlmain input.rlrd.rlr5:checked ~ .rlview .rlstage {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition:
    opacity .32s ease-out,
    transform .42s var(--rl-ez-panel),
    visibility .32s;
}

/* 舞台顶部装饰扫描线 */
.rlmain .rlstage::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  width: 30%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--rl-order), var(--rl-gold), transparent);
  filter: drop-shadow(0 0 5px rgba(77, 208, 255, .9));
  animation: rlScanX 4.6s linear infinite;
}

/* ---------- 舞台头部：标题 + 关闭 ---------- */
.rlmain .rlsthd {
  position: relative;
  z-index: 2;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
  box-sizing: border-box;
  height: 44px;
  padding: 0 8px 0 13px;
  background: linear-gradient(180deg, rgba(34, 48, 82, .82), rgba(16, 21, 36, .9));
  border-bottom: 1px solid var(--rl-line2);
  box-shadow: 0 3px 14px rgba(0, 0, 0, .5);
}

.rlmain .rlsthd > i {
  position: relative;
  flex: 0 0 auto;
  width: 3px;
  height: 16px;
  background: linear-gradient(180deg, var(--rl-order), var(--rl-chaos));
  filter: drop-shadow(0 0 5px rgba(77, 208, 255, .85));
}

.rlmain .rlsthd > b {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  font-size: 12px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: 2.2px;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-shadow: 0 0 9px rgba(77, 208, 255, .5);
}

/* 六路标题注入 —— CSS 生成，AI 不必输出 */
.rlmain input.rlrd.rlr0:checked ~ .rlview .rlsthd > b::before { content: '主角信息 / CHARACTER'; }
.rlmain input.rlrd.rlr1:checked ~ .rlview .rlsthd > b::before { content: '互动角色 / CONTACT'; }
.rlmain input.rlrd.rlr2:checked ~ .rlview .rlsthd > b::before { content: '世界联络平台 / CHANNEL'; }
.rlmain input.rlrd.rlr3:checked ~ .rlview .rlsthd > b::before { content: '地区与任务 / REGION'; }
.rlmain input.rlrd.rlr4:checked ~ .rlview .rlsthd > b::before { content: '关系网 / RELATION'; }
.rlmain input.rlrd.rlr5:checked ~ .rlview .rlsthd > b::before { content: '过往记忆 / ARCHIVE'; }

/* 舞台关闭按钮 —— 指向空档位 radio */
.rlmain .rlstclose {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 5px;
  box-sizing: border-box;
  height: 28px;
  padding: 0 10px 0 8px;
  cursor: pointer;
  background: rgba(255, 45, 85, .1);
  border: 1px solid rgba(255, 45, 85, .34);
  border-radius: 2px;
  transition: background .18s ease-out, border-color .18s ease-out, transform .2s var(--rl-ez-pop);
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}

.rlmain .rlstclose::before {
  content: '';
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  background-color: var(--rl-chaos);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.4 5.4 7.8 12l6.6 6.6' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.4 5.4 7.8 12l6.6 6.6' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-size: 14px 14px;
  mask-size: 14px 14px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: transform .2s var(--rl-ez-pop);
}

.rlmain .rlstclose::after {
  content: '返回正文';
  font-size: 10px;
  font-weight: 700;
  color: var(--rl-chaos);
  letter-spacing: 1px;
  white-space: nowrap;
}

.rlmain .rlstclose:hover {
  background: rgba(255, 45, 85, .22);
  border-color: var(--rl-chaos);
  transform: translateX(-2px);
}

.rlmain .rlstclose:hover::before {
  transform: translateX(-3px);
  filter: drop-shadow(0 0 6px rgba(255, 45, 85, .95));
}

.rlmain .rlstclose:active {
  transform: scale(.95);
}

/* ---------- 舞台内容宿主 ---------- */
.rlmain .rlstbd {
  position: relative;
  flex: 1 1 auto;
  min-height: 120px;
}

/* 面板本体：绝对定位堆叠，高度由舞台决定 */
.rlmain .rlpn {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  padding: 13px 14px 34px;
  overflow-x: hidden;
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  scrollbar-width: thin;
  scrollbar-color: var(--rl-line2) transparent;
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
  transition: opacity .2s ease-in, visibility .2s;
}

.rlmain .rlpn::-webkit-scrollbar {
  width: 7px;
}

.rlmain .rlpn::-webkit-scrollbar-track {
  background: rgba(5, 7, 12, .7);
  border-left: 1px solid rgba(34, 48, 82, .5);
}

.rlmain .rlpn::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--rl-order-d), var(--rl-line2));
  box-shadow: inset 0 0 3px rgba(77, 208, 255, .45);
}

.rlmain .rlpn::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, var(--rl-order), var(--rl-order-d));
}

/* 六路面板显隐穷举 */
.rlmain input.rlrd.rlr0:checked ~ .rlview .rlstbd > .rlpn.rlp0,
.rlmain input.rlrd.rlr1:checked ~ .rlview .rlstbd > .rlpn.rlp1,
.rlmain input.rlrd.rlr2:checked ~ .rlview .rlstbd > .rlpn.rlp2,
.rlmain input.rlrd.rlr3:checked ~ .rlview .rlstbd > .rlpn.rlp3,
.rlmain input.rlrd.rlr4:checked ~ .rlview .rlstbd > .rlpn.rlp4,
.rlmain input.rlrd.rlr5:checked ~ .rlview .rlstbd > .rlpn.rlp5 {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .34s ease-out .06s, visibility .34s;
}

/* 面板内子块错峰入场 */
.rlmain .rlpn > * {
  animation: rlItemIn .5s var(--rl-ez-panel) both;
}

.rlmain .rlpn > *:nth-child(1) { animation-delay: .06s; }
.rlmain .rlpn > *:nth-child(2) { animation-delay: .1s; }
.rlmain .rlpn > *:nth-child(3) { animation-delay: .14s; }
.rlmain .rlpn > *:nth-child(4) { animation-delay: .18s; }
.rlmain .rlpn > *:nth-child(5) { animation-delay: .22s; }
.rlmain .rlpn > *:nth-child(6) { animation-delay: .26s; }
.rlmain .rlpn > *:nth-child(7) { animation-delay: .3s; }
.rlmain .rlpn > *:nth-child(8) { animation-delay: .34s; }
.rlmain .rlpn > *:nth-child(n+9) { animation-delay: .38s; }

@keyframes rlItemIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 面板底部溢出淡出提示 —— 暗示可继续滚动 */
.rlmain .rlstbd::after {
  content: '';
  position: absolute;
  right: 7px;
  bottom: 0;
  left: 0;
  z-index: 2;
  height: 26px;
  background: linear-gradient(180deg, transparent, rgba(6, 8, 15, .95));
  pointer-events: none;
}

/* ---------- 面板内双列网格组件 ---------- */
.rlmain .rlgrid2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 9px;
  margin: 0 0 9px;
}

.rlmain .rlgrid3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px 8px;
  margin: 0 0 9px;
}

/* ============================================================
   11. 【新增】行动建议区 —— 常驻可见，可折叠
   ============================================================ */
.rlmain .rlact {
  position: relative;
  z-index: 25;
  flex: 0 0 auto;
  box-sizing: border-box;
  background: linear-gradient(180deg, rgba(16, 21, 36, .96), rgba(9, 12, 21, .98));
  border-top: 1px solid var(--rl-line2);
  box-shadow: 0 -4px 16px rgba(0, 0, 0, .45);
}

/* 顶缘能量流 */
.rlmain .rlact::before {
  content: '';
  position: absolute;
  top: -1px;
  left: 0;
  width: 26%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--rl-gold), transparent);
  filter: drop-shadow(0 0 4px rgba(255, 201, 77, .85));
  animation: rlScanX 6.2s linear infinite;
}

/* ---------- 折叠头部 ---------- */
.rlmain .rlacthd {
  display: flex;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  height: 31px;
  padding: 0 11px;
  cursor: pointer;
  transition: background .18s ease-out;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}

.rlmain .rlacthd:hover {
  background: rgba(255, 201, 77, .07);
}

.rlmain .rlacthd > i {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 5px rgba(255, 201, 77, .7));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2 2.4 4.6 13.8h5.4l-1.4 7.8 9.4-11.8h-5.6Z' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2 2.4 4.6 13.8h5.4l-1.4 7.8 9.4-11.8h-5.6Z' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-size: 15px 15px;
  mask-size: 15px 15px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  animation: rlBreath 2.8s ease-in-out infinite;
}

.rlmain .rlacthd > b {
  flex: 1 1 auto;
  font-size: 10.5px;
  font-weight: 700;
  color: var(--rl-gold);
  letter-spacing: 1.8px;
}

.rlmain .rlacthd > b::before {
  content: '行动建议 / ACTION';
}

.rlmain .rlacthd > b::after {
  content: ' ×' attr(n);
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 10px;
  color: var(--rl-txt3);
  letter-spacing: 0;
}

/* 折叠箭头 */
.rlmain .rlactar {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  background-color: var(--rl-txt2);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.4 14.4 12 7.8l6.6 6.6' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.4 14.4 12 7.8l6.6 6.6' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-size: 15px 15px;
  mask-size: 15px 15px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transform-origin: center;
  transition: transform .34s cubic-bezier(.4, 0, .2, 1), background-color .18s ease-out;
}

.rlmain .rlacthd:hover .rlactar {
  background-color: var(--rl-gold);
}

/* ---------- 建议列表 ---------- */
.rlmain .rlactbd {
  box-sizing: border-box;
  max-height: 168px;
  padding: 0 11px 9px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--rl-line2) transparent;
  transition: max-height .34s cubic-bezier(.4, 0, .2, 1),
              padding .34s cubic-bezier(.4, 0, .2, 1);
}

.rlmain .rlactbd::-webkit-scrollbar {
  width: 5px;
}

.rlmain .rlactbd::-webkit-scrollbar-track {
  background: rgba(5, 7, 12, .6);
}

.rlmain .rlactbd::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--rl-gold-d), var(--rl-line2));
  border-radius: 2px;
}

.rlmain .rlactbd::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, var(--rl-gold), var(--rl-gold-d));
}

/* 默认收起 - !important 确保覆盖容器查询，勾选后展开 */
.rlmain input.rlck.rlac2:not(:checked) ~ .rlact .rlactbd {
  max-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
}

.rlmain input.rlck.rlac2:not(:checked) ~ .rlact .rlactar {
  transform: rotate(180deg);
}

/* ---------- 单条建议 ---------- */
.rlmain .rlaci {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  box-sizing: border-box;
  padding: 6px 10px 6px 8px;
  margin: 0 0 4px;
  overflow: hidden;
  background: linear-gradient(90deg, rgba(28, 36, 64, .68), rgba(20, 26, 44, .34));
  border: 1px solid var(--rl-line);
  border-left: 2px solid var(--rl-line2);
  border-radius: 0 2px 2px 0;
  cursor: pointer;
  transition:
    background .2s ease-out,
    border-color .2s ease-out,
    border-left-color .2s ease-out,
    transform .22s var(--rl-ez-panel),
    box-shadow .22s ease-out;
}

.rlmain .rlaci:last-child {
  margin-bottom: 0;
}

/* 掠过光泽 */
.rlmain .rlaci::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -110%;
  width: 45%;
  height: 200%;
  background: linear-gradient(90deg, transparent, rgba(180, 220, 255, .12), transparent);
  transform: rotate(20deg);
  transition: left .55s var(--rl-ez-panel);
  pointer-events: none;
}

.rlmain .rlaci:hover::before {
  left: 170%;
}

.rlmain .rlaci:hover {
  background: linear-gradient(90deg, rgba(77, 208, 255, .14), rgba(20, 26, 44, .4));
  border-color: var(--rl-order-d);
  border-left-color: var(--rl-order);
  transform: translateX(4px);
  box-shadow: 0 0 10px rgba(77, 208, 255, .28);
}

/* 按下反馈 */
.rlmain .rlaci:active {
  transform: translateX(2px) scale(.995);
}

/* 序号章标 */
.rlmain .rlaci > s {
  flex: 0 0 auto;
  box-sizing: border-box;
  min-width: 22px;
  padding: 1px 0;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 10px;
  font-weight: 700;
  color: var(--rl-txt2);
  text-align: center;
  text-decoration: none;
  letter-spacing: .5px;
  background: rgba(5, 7, 12, .8);
  border: 1px solid var(--rl-line2);
  border-radius: 1px;
  transition: color .2s ease-out, border-color .2s ease-out, background .2s ease-out;
}

.rlmain .rlaci:hover > s {
  color: var(--rl-order);
  background: rgba(77, 208, 255, .14);
  border-color: var(--rl-order-d);
}

.rlmain .rlaci > span {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--rl-txt);
}

/* ---------- 高风险条目 ---------- */
.rlmain .rlaci[hi="1"] {
  background: linear-gradient(90deg, rgba(255, 45, 85, .13), rgba(20, 26, 44, .34));
  border-color: rgba(255, 45, 85, .34);
  border-left-color: var(--rl-chaos);
}

.rlmain .rlaci[hi="1"] > s {
  color: var(--rl-chaos);
  background: rgba(255, 45, 85, .14);
  border-color: rgba(255, 45, 85, .42);
}

.rlmain .rlaci[hi="1"] > span::after {
  content: 'RISK';
  display: inline-block;
  padding: 0 5px;
  margin-left: 6px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8.5px;
  font-weight: 700;
  color: var(--rl-chaos);
  letter-spacing: 1.2px;
  vertical-align: 1px;
  background: rgba(255, 45, 85, .16);
  border: 1px solid rgba(255, 45, 85, .45);
  border-radius: 1px;
  animation: rlBreath 1.6s ease-in-out infinite;
}

.rlmain .rlaci[hi="1"]:hover {
  background: linear-gradient(90deg, rgba(255, 45, 85, .24), rgba(20, 26, 44, .4));
  border-color: var(--rl-chaos);
  box-shadow: 0 0 8px rgba(255, 45, 85, .6), 0 0 24px rgba(255, 45, 85, .3), 0 0 48px rgba(255, 45, 85, .12);
}

.rlmain .rlaci[hi="1"]:hover > s {
  color: #fff;
  background: rgba(255, 45, 85, .34);
  border-color: var(--rl-chaos);
}

/* ============================================================
   12. 【补充】容器查询与媒体查询更新
   ============================================================ */
@container rlbox (min-width: 620px) {
  .rlmain .rlactbd {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 9px;
    max-height: 132px;
    overflow-y: auto;
  }
  .rlmain .rlaci {
    margin-bottom: 0;
  }
  .rlmain input.rlck.rlac2:not(:checked) ~ .rlact .rlactbd {
    max-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden !important;
  }
}

@media (max-width: 420px) {
  .rlmain .rlactbd {
    max-height: 140px;
    overflow-y: auto;
  }
  .rlmain .rlaci {
    padding: 5px 8px 5px 7px;
  }
}


/* ============================================================
   补丁：tooltip 防截断优化 —— 智能定位策略
   ============================================================ */

/* 方案二修正：基于父容器类型的智能对齐 */

/* 双列网格：第2列右对齐 */
.rlmain .rlgrid2 > *:nth-child(2n) .rlcap > i {
  left: auto;
  right: 0;
}

.rlmain .rlgrid2 > *:nth-child(2n) .rlcap > i::before {
  left: auto;
  right: 14px;
}

.rlmain .rlgrid2 > *:nth-child(2n) .rlcap > i::after {
  left: auto;
  right: 15px;
}

/* 三列网格：第3列右对齐 */
.rlmain .rlgrid3 > *:nth-child(3n) .rlcap > i {
  left: auto;
  right: 0;
}

.rlmain .rlgrid3 > *:nth-child(3n) .rlcap > i::before {
  left: auto;
  right: 14px;
}

.rlmain .rlgrid3 > *:nth-child(3n) .rlcap > i::after {
  left: auto;
  right: 15px;
}

/* 三列网格：第2列居中（可选，避免偏移太远） */
.rlmain .rlgrid3 > *:nth-child(3n-1) .rlcap > i {
  left: 50%;
  transform: translateX(-50%);
}

.rlmain .rlgrid3 > *:nth-child(3n-1) .rlcap > i::before,
.rlmain .rlgrid3 > *:nth-child(3n-1) .rlcap > i::after {
  left: 50%;
  transform: translateX(-50%);
}

/* 方案三：提升层级，确保不被相邻元素遮挡 */
.rlmain .rlcap:hover {
  z-index: 100000;
}

.rlmain .rlcap:hover > i {
  z-index: 100001;
}

/* ============================================================
   13. 容错补丁层 —— 结构错位时的降级兜底
   必须置于内置css最末尾（同权重靠后者胜）
   ============================================================ */

/* ---------- 13-1 面板寻址放宽：直接子 → 后代 ---------- */
/* rlpn 被误嵌进别的 rlpn 时，仍能被选中态命中 */
.rlmain input.rlrd.rlr0:checked ~ .rlview .rlstbd .rlpn.rlp0,
.rlmain input.rlrd.rlr1:checked ~ .rlview .rlstbd .rlpn.rlp1,
.rlmain input.rlrd.rlr2:checked ~ .rlview .rlstbd .rlpn.rlp2,
.rlmain input.rlrd.rlr3:checked ~ .rlview .rlstbd .rlpn.rlp3,
.rlmain input.rlrd.rlr4:checked ~ .rlview .rlstbd .rlpn.rlp4,
.rlmain input.rlrd.rlr5:checked ~ .rlview .rlstbd .rlpn.rlp5 {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .34s ease-out .06s, visibility .34s;
}

/* ---------- 13-3 兄弟链重建：四大组件掉进 .rlview 时的双路寻址 ----------
   :is(目标, .rlview) 让「直接兄弟」与「藏在 rlview 里」两种形态共用一条规则 */

/* 导航按钮选中态 */
.rlmain input.rlrd.rlr0:checked ~ :is(.rlnavbar, .rlview) .rlb0,
.rlmain input.rlrd.rlr1:checked ~ :is(.rlnavbar, .rlview) .rlb1,
.rlmain input.rlrd.rlr2:checked ~ :is(.rlnavbar, .rlview) .rlb2,
.rlmain input.rlrd.rlr3:checked ~ :is(.rlnavbar, .rlview) .rlb3,
.rlmain input.rlrd.rlr4:checked ~ :is(.rlnavbar, .rlview) .rlb4,
.rlmain input.rlrd.rlr5:checked ~ :is(.rlnavbar, .rlview) .rlb5 {
  background: linear-gradient(180deg, rgba(77, 208, 255, .2) 0%, rgba(20, 30, 54, .98) 62%, rgba(14, 18, 32, .99) 100%);
}

.rlmain input.rlrd.rlr0:checked ~ :is(.rlnavbar, .rlview) .rlb0 i,
.rlmain input.rlrd.rlr1:checked ~ :is(.rlnavbar, .rlview) .rlb1 i,
.rlmain input.rlrd.rlr2:checked ~ :is(.rlnavbar, .rlview) .rlb2 i,
.rlmain input.rlrd.rlr3:checked ~ :is(.rlnavbar, .rlview) .rlb3 i,
.rlmain input.rlrd.rlr4:checked ~ :is(.rlnavbar, .rlview) .rlb4 i,
.rlmain input.rlrd.rlr5:checked ~ :is(.rlnavbar, .rlview) .rlb5 i {
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 8px rgba(77, 208, 255, .95));
  transform: translateY(-3px) scale(1.1);
  animation: rlIconBreath 2.6s ease-in-out infinite;
}

.rlmain input.rlrd.rlr0:checked ~ :is(.rlnavbar, .rlview) .rlb0 span,
.rlmain input.rlrd.rlr1:checked ~ :is(.rlnavbar, .rlview) .rlb1 span,
.rlmain input.rlrd.rlr2:checked ~ :is(.rlnavbar, .rlview) .rlb2 span,
.rlmain input.rlrd.rlr3:checked ~ :is(.rlnavbar, .rlview) .rlb3 span,
.rlmain input.rlrd.rlr4:checked ~ :is(.rlnavbar, .rlview) .rlb4 span,
.rlmain input.rlrd.rlr5:checked ~ :is(.rlnavbar, .rlview) .rlb5 span {
  color: var(--rl-order);
  font-weight: 700;
  text-shadow: 0 0 8px rgba(77, 208, 255, .6);
}

.rlmain input.rlrd.rlr0:checked ~ :is(.rlnavbar, .rlview) .rlb0::after,
.rlmain input.rlrd.rlr1:checked ~ :is(.rlnavbar, .rlview) .rlb1::after,
.rlmain input.rlrd.rlr2:checked ~ :is(.rlnavbar, .rlview) .rlb2::after,
.rlmain input.rlrd.rlr3:checked ~ :is(.rlnavbar, .rlview) .rlb3::after,
.rlmain input.rlrd.rlr4:checked ~ :is(.rlnavbar, .rlview) .rlb4::after,
.rlmain input.rlrd.rlr5:checked ~ :is(.rlnavbar, .rlview) .rlb5::after {
  transform: scaleX(1);
}

/* 行动建议默认收起，勾选后展开 */
.rlmain input.rlck.rlac2:not(:checked) ~ :is(.rlact, .rlview) .rlactbd {
  max-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
}

.rlmain input.rlck.rlac2:not(:checked) ~ :is(.rlact, .rlview) .rlactar {
  transform: rotate(180deg);
}

/* 设置按钮激活态 */
.rlmain input.rlck.rlst2:checked ~ :is(.rltop, .rlview) .rlsetbtn {
  background: linear-gradient(145deg, rgba(255, 45, 85, .28), rgba(14, 18, 32, .9));
  border-color: var(--rl-chaos);
}

.rlmain input.rlck.rlst2:checked ~ :is(.rltop, .rlview) .rlsetbtn::before {
  background-color: var(--rl-chaos);
  filter: drop-shadow(0 0 8px rgba(255, 45, 85, .9));
  transform: rotate(90deg);
}

/* 遮罩与设置面板（subject 是自身，只能显式双写） */
.rlmain input.rlck.rlst2:checked ~ .rlview .rlmask {
  opacity: 1;
  visibility: visible;
}

.rlmain input.rlck.rlst2:checked ~ .rlview .rlsetpanel {
  transform: translateX(0);
}

/* ---------- 13-4 错位后的定位与层叠修正 ---------- */
/* 落进 rlview 的组件抬到舞台之上，不被 .rlstage 的 inset:0 吞掉 */
.rlmain .rlview > .rlact,
.rlmain .rlview > .rlnavbar {
  position: relative;
  z-index: 26;
  flex: 0 0 auto;
}

/* rlview 是 z-index:2 的层叠上下文，设置面板会被 z6 的顶栏压住 → 整体抬升 */
.rlmain .rlview:has(> .rlsetpanel),
.rlmain .rlview:has(> .rlmask) {
  z-index: 32;
}

/* absolute 的遮罩与面板会缩进阅读区 → 负偏移近似还原到整卡高度 */
.rlmain .rlview > .rlmask,
.rlmain .rlview > .rlsetpanel {
  top: -58px;
  bottom: -76px;
}

/* 导航条留在 rlview 内时，给滚动内容让出被遮挡的高度 */
.rlmain .rlview:has(> .rlnavbar) .rlpn {
  padding-bottom: 112px;
}

.rlmain .rlview:has(> .rlnavbar) .rlbody {
  padding-bottom: 30px;
}

/* ---------- 13-5 卡片嵌套压平 ---------- */
.rlmain .rlcard .rlcard {
  margin: 9px 0 0;
  padding: 9px 11px;
  background: rgba(20, 26, 44, .5);
  border-color: var(--rl-line);
  clip-path: none;
  filter: none;
}

.rlmain .rlcard .rlcard::before,
.rlmain .rlcard .rlcard::after {
  display: none;
}

.rlmain .rlcard .rlcard:hover {
  transform: none;
  filter: none;
  border-color: var(--rl-order-d);
}

/* ---------- 13-6 裸露组件补壳 ---------- */
/* 忘了包 .rlcard 的 rlrow / grid，也给一层卡片质感 */
.rlmain .rlpn > .rlrow,
.rlmain .rlpn > .rlgrid2,
.rlmain .rlpn > .rlgrid3 {
  box-sizing: border-box;
  padding: 9px 11px;
  margin: 0 0 9px;
  background: linear-gradient(150deg, rgba(28, 36, 64, .85), rgba(14, 18, 32, .92));
  border: 1px solid var(--rl-line2);
  clip-path: polygon(var(--rl-cut) 0, 100% 0, 100% calc(100% - var(--rl-cut)), calc(100% - var(--rl-cut)) 100%, 0 100%, 0 var(--rl-cut));
}

.rlmain .rlpn > .rlrow {
  border-left: 2px solid var(--rl-order-d);
}

/* 嵌套网格降为单列，防止列宽被挤成条 */
.rlmain .rlgrid2 :is(.rlgrid2, .rlgrid3),
.rlmain .rlgrid3 :is(.rlgrid2, .rlgrid3) {
  grid-template-columns: minmax(0, 1fr);
  margin-bottom: 0;
}

/* ---------- 13-7 杂标签兜底隐藏 ---------- */
.rlmain think,
.rlmain wldata,
.rlmain anchor {
  display: none !important;
}

/* ---------- 13-8 结构报警：舞台头部竖条变红 ----------
   只有你认得这个信号，玩家只会以为是配色 */
.rlmain:has(.rlcard .rlcard) .rlsthd > i,
.rlmain:has(.rlpn .rlpn) .rlsthd > i,
.rlmain:has(.rlview > .rlnavbar) .rlsthd > i,
.rlmain:has(.rlview > .rlact) .rlsthd > i,
.rlmain:has(.rlpn > .rlrow) .rlsthd > i {
  width: 5px;
  background: var(--rl-chaos);
  filter: drop-shadow(0 0 7px rgba(255, 45, 85, .95));
  animation: rlBreath 1s ease-in-out infinite;
}

/* ============================================================
   14. tooltip 遮挡修复 —— 层叠上下文解锁 + 底部翻转
   必须置于内置css最末尾
   ============================================================ */

/* ---------- 14-1 解开层级倒挂 ----------
   rlview 抬到 navbar/act(25) 之上、mask(30)/setpanel(31) 之下。
   rlstage 是 inset:0 限定在 rlview 内，与 navbar/act 物理不重叠，
   未选中时 visibility:hidden + pointer-events:none，不会抢点击 */
.rlmain .rlview {
  z-index: 27;
}

/* 13-4 错位分支同步上调，保持设置面板仍在最上 */
.rlmain .rlview:has(> .rlsetpanel),
.rlmain .rlview:has(> .rlmask) {
  z-index: 33;
}

/* 落进 rlview 的组件继续压住舞台 */
.rlmain .rlview > .rlact,
.rlmain .rlview > .rlnavbar {
  z-index: 28;
}

/* ---------- 14-2 hover 时撤掉底部渐变遮罩 ---------- */
.rlmain .rlstbd:has(.rlcap:hover)::after {
  opacity: 0;
  transition: opacity .18s ease-out;
}

/* ---------- 14-3 底部卡片 tooltip 向上翻转 ----------
   CSS 无法感知距底距离，按结构位置近似：
   面板内最后两张卡片、以及卡片内最后一组行，一律向上开 */
.rlmain .rlpn > .rlcard:nth-last-child(-n+2) .rlcap > i,
.rlmain .rlpn > .rlcard:last-child .rlcap > i {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: 6px;
  transform: translateY(4px) scale(.96);
}

.rlmain .rlpn > .rlcard:nth-last-child(-n+2) .rlcap:hover > i,
.rlmain .rlpn > .rlcard:last-child .rlcap:hover > i {
  transform: translateY(0) scale(1);
}

/* 箭头翻到下沿 */
.rlmain .rlpn > .rlcard:nth-last-child(-n+2) .rlcap > i::before,
.rlmain .rlpn > .rlcard:last-child .rlcap > i::before {
  bottom: auto;
  top: 100%;
  border-bottom-color: transparent;
  border-top-color: var(--rl-order-d);
}

.rlmain .rlpn > .rlcard:nth-last-child(-n+2) .rlcap > i::after,
.rlmain .rlpn > .rlcard:last-child .rlcap > i::after {
  bottom: auto;
  top: 100%;
  border-bottom-color: transparent;
  border-top-color: rgba(12, 16, 28, .98);
}

/* 向上翻转时保持列对齐规则（右列/中列） */
.rlmain .rlpn > .rlcard:nth-last-child(-n+2) .rlgrid2 > *:nth-child(2n) .rlcap > i::before,
.rlmain .rlpn > .rlcard:nth-last-child(-n+2) .rlgrid2 > *:nth-child(2n) .rlcap > i::after,
.rlmain .rlpn > .rlcard:nth-last-child(-n+2) .rlgrid3 > *:nth-child(3n) .rlcap > i::before,
.rlmain .rlpn > .rlcard:nth-last-child(-n+2) .rlgrid3 > *:nth-child(3n) .rlcap > i::after {
  left: auto;
  right: 14px;
}

/* ---------- 14-6 hover 链路层级链补齐 ----------
   把从 rlstbd 到 rlcap 的每一环都抬起来，
   防止中途某个 rlcard 的 filter/clip-path 重新造出裁剪盒 */
.rlmain .rlstbd:has(.rlcap:hover) {
  z-index: 200;
}

.rlmain .rlpn:has(.rlcap:hover) {
  z-index: 201;
}

.rlmain .rlcard:has(.rlcap:hover) {
  z-index: 202;
  filter: none;
}

.rlmain .rlcard:has(.rlcap:hover):hover {
  filter: none;
}

/* ============================================================
   15. tooltip 全量展开 —— 去滚轮，一次性显示全部内容
   必须置于内置css最末尾（在 14 之后）
   ============================================================ */

/* ---------- 15-3 向上翻转判定放宽到最后三张卡片 ----------
   tooltip 变高后，倒数第三张卡片向下开也会被 rlpn 裁掉 */
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) .rlcap > i {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: 6px;
  transform: translateY(4px) scale(.96);
}

.rlmain .rlpn > .rlcard:nth-last-child(-n+3) .rlcap:hover > i {
  transform: translateY(0) scale(1);
}

.rlmain .rlpn > .rlcard:nth-last-child(-n+3) .rlcap > i::before {
  bottom: auto;
  top: 100%;
  border-bottom-color: transparent;
  border-top-color: var(--rl-order-d);
}

.rlmain .rlpn > .rlcard:nth-last-child(-n+3) .rlcap > i::after {
  bottom: auto;
  top: 100%;
  border-bottom-color: transparent;
  border-top-color: rgba(12, 16, 28, .98);
}

/* ---------- 15-4 窄屏：宽度贴合容器，去掉箭头省高度 ---------- */
@container rlbox (max-width: 420px) {
  .rlmain .rlcap > i {
    width: calc(100cqw - 72px);
    max-width: none;
    font-size: 10px;
    line-height: 1.5;
  }
  .rlmain .rlcap > i::before,
  .rlmain .rlcap > i::after {
    display: none;
  }
}

/* ============================================================
   16. 个人联络终端 · INBOX TERMINAL
   命名空间 rlmsg追加至内置CSS末尾
   ============================================================ */

/* ---------- 终端卡片容器 ---------- */
.rlmain .rlmsgcard {
  padding: 0;
  overflow: visible;
}

/* ---------- 终端状态栏 ---------- */
.rlmain .rlmsghd {
  display: flex;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  height: 38px;
  padding: 0 12px;
  background: linear-gradient(90deg, rgba(28, 36, 64, .92), rgba(20, 26, 44, .88));
  border-bottom: 1px solid var(--rl-line2);
}

/* 信封图标 */
.rlmain .rlmsghd > i {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 4px rgba(255, 201, 77, .5));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5.4' width='18' height='13.2' rx='1.4' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M3 6.6l9 6.2 9-6.2' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5.4' width='18' height='13.2' rx='1.4' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M3 6.6l9 6.2 9-6.2' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-size:16px 16px;
  mask-size: 16px 16px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

/* 标题—— CSS注入 */
.rlmain .rlmsghd > b {
  flex: 1 1 auto;
  font-size: 10.5px;
  font-weight: 700;
  color: var(--rl-gold);
  letter-spacing: 1.6px;
  text-shadow: 0 0 7px rgba(255, 201, 77, .45);
}

.rlmain .rlmsghd > b::before {
  content: '个人联络终端 / INBOX';
}

/* 收件计数 */
.rlmain .rlmsghd > span {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 600;
  color: var(--rl-txt3);
  letter-spacing: .6px;
  white-space: nowrap;
}

/* ---------- 消息滚动容器（与rldmbox同风格） ---------- */
.rlmain .rlmsgbox {
  position: relative;
  box-sizing: border-box;
  max-height: 220px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  background:
    linear-gradient(180deg, rgba(5, 7, 12, .96) 0%, rgba(8, 10, 16, .7) 15%, rgba(8, 10, 16, .7) 85%, rgba(5, 7, 12, .96) 100%),
    linear-gradient(90deg, rgba(34, 48, 82, .25), rgba(14, 18, 32, .15));
  border-top: 1px solid var(--rl-line);
  scrollbar-width: thin;
  scrollbar-color: var(--rl-line2) transparent;-webkit-user-select: none;
  user-select: none;
}

.rlmain .rlmsgbox::-webkit-scrollbar {
  width: 4px;
}

.rlmain .rlmsgbox::-webkit-scrollbar-track {
  background: transparent;
}

.rlmain .rlmsgbox::-webkit-scrollbar-thumb {
  background: var(--rl-line2);
  border-radius: 2px;
}

.rlmain .rlmsgbox::-webkit-scrollbar-thumb:hover {
  background: var(--rl-order-d);
}

.rlmain .rlmsglist {
  padding: 6px 10px;
}

/* ---------- 单条消息（与rlrow同风格） ---------- */
.rlmain .rlmsg {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  box-sizing: border-box;
  padding: 7px 10px 7px 12px;
  margin: 0 0 3px;
  background: linear-gradient(90deg, rgba(28, 36, 64, .5), rgba(28, 36, 64, 0));
  border-left: 2px solid var(--rl-line2);
  transition: background .18s ease-out, border-color .18s ease-out, padding-left .18s ease-out;
}

.rlmain .rlmsg:last-child {
  margin-bottom: 0;
}

.rlmain .rlmsg:hover {
  background: linear-gradient(90deg, rgba(77, 208, 255, .1), rgba(28, 36, 64, 0));
  border-left-color: var(--rl-order);
  padding-left: 16px;
}

/* 发信人标签 */
.rlmain .rlmsg > .rltag {
  align-self: flex-start;
  margin: 0;
}

.rlmain .rlmsg > nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

/* 时间戳 */
.rlmain .rlmsg > nav > s {
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 9.5px;
  font-weight: 600;
  color: var(--rl-txt3);
  text-decoration: none;
  letter-spacing: .8px;
}

/* 消息正文 */
.rlmain .rlmsg > nav > span {
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--rl-txt);
  word-break: break-word;
  white-space: normal;
}

/* ---------- 消息类型色条 (mt属性) ---------- */

/* 情报*/
.rlmain .rlmsg[mt="intel"] { border-left-color: var(--rl-order); }
.rlmain .rlmsg[mt="intel"]::after {
  content: 'INTEL';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: 1.2px;
  background: rgba(77, 208, 255, .1);
  border: 1px solid rgba(77, 208, 255, .3);
  border-radius: 1px;
}
.rlmain .rlmsg[mt="intel"]:hover { border-left-color: var(--rl-order); }

/* 交易 */
.rlmain .rlmsg[mt="trade"] { border-left-color: var(--rl-gold); }
.rlmain .rlmsg[mt="trade"]::after {
  content: 'TRADE';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: var(--rl-gold);
  letter-spacing: 1.2px;
  background: rgba(255, 201, 77, .1);
  border: 1px solid rgba(255, 201, 77, .3);
  border-radius: 1px;
}
.rlmain .rlmsg[mt="trade"]:hover { border-left-color: var(--rl-gold); }

/* 招募 */
.rlmain .rlmsg[mt="recruit"] { border-left-color: var(--rl-nature); }
.rlmain .rlmsg[mt="recruit"]::after {
  content: 'RECRUIT';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: var(--rl-nature);
  letter-spacing: 1.2px;
  background: rgba(61, 220, 151, .1);
  border: 1px solid rgba(61, 220, 151, .3);
  border-radius: 1px;
}
.rlmain .rlmsg[mt="recruit"]:hover { border-left-color: var(--rl-nature); }

/* 警告 */
.rlmain .rlmsg[mt="warn"] { border-left-color: var(--rl-chaos); }
.rlmain .rlmsg[mt="warn"]::after {
  content: 'WARN';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: var(--rl-chaos);
  letter-spacing: 1.2px;
  background: rgba(255, 45, 85, .1);
  border: 1px solid rgba(255, 45, 85, .3);
  border-radius: 1px;
}
.rlmain .rlmsg[mt="warn"]:hover { border-left-color: var(--rl-chaos); }

/* 系统 */
.rlmain .rlmsg[mt="sys"] { border-left-color: #b968ff; }
.rlmain .rlmsg[mt="sys"]::after {
  content: 'SYSTEM';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: #b968ff;
  letter-spacing: 1.2px;
  background: rgba(185, 104, 255, .1);
  border: 1px solid rgba(185, 104, 255, .3);
  border-radius: 1px;
}
.rlmain .rlmsg[mt="sys"]:hover { border-left-color: #b968ff; }

/* ---------- 紧急度 (ur属性) ---------- */
.rlmain .rlmsg[ur="2"] { border-left-width: 3px; }
.rlmain .rlmsg[ur="3"] { border-left-width: 4px; }

/* ---------- 消息内嵌套rlcap时的层级保护 ---------- */
.rlmain .rlmsg:has(.rlcap:hover) {
  z-index: 9000;
}

.rlmain .rlmsgbox:has(.rlcap:hover) {
  overflow: visible;
}

.rlmain .rlmsgcard:has(.rlcap:hover) {
  z-index: 202;
  clip-path: none;
  filter: none;
  overflow: visible;
}

/* ----------窄屏适配 ---------- */
@container rlbox (max-width: 460px) {
  .rlmain .rlmsgbox {
    max-height: 180px;
  }
  .rlmain .rlmsg {
    padding: 6px 8px 6px 10px;
  }
  .rlmain .rlmsg > nav > span {
    font-size: 11px;
  }
  .rlmain .rlmsghd {
    height: 34px;
    padding: 0 10px;
  }
  .rlmain .rlmsghd > b {
    font-size: 9.5px;
    letter-spacing: 1.2px;
  }
}

@container rlbox (max-width: 350px) {
  .rlmain .rlmsgbox {
    max-height: 160px;
  }
  .rlmain .rlmsg::after {
    display: none !important;
  }
  .rlmain .rlmsghd > b::before {
    content: '联络终端 / INBOX';
  }
}

/* ============================================================
   17. 分类标签栏 · SECTION TAB BAR v4
   details+summary 原生点击 + CSS :has() 互斥
   不依赖 id / name / for，彻底绕过平台净化器
   ============================================================ */

/* 17-1 容器基础 */
.rlmain .rlsecbar {
  position: relative;
  padding-top: 42px;
  min-height: 42px;
}

/* 17-2 所有分区内容默认隐藏 */
.rlmain .rlsecbar > .rlsec > .rlsecbd { display: none; }

/* 17-3 某 details[open] 时显示其内容 */
.rlmain .rlsecbar > .rlsec[open] > .rlsecbd { display: block; }

/* 17-4 无任何 details open 时的默认显示（首个分区） */
.rlmain .rlp0 .rlsecbar:not(:has(.rlsec[open])) .rlsec[data-sec="p"] > .rlsecbd { display: block; }
.rlmain .rlp1 .rlsecbar:not(:has(.rlsec[open])) .rlsec-npc[data-idx="0"] > .rlsecbd { display: block; }
.rlmain .rlp3 .rlsecbar:not(:has(.rlsec[open])) .rlsec[data-sec="m"] > .rlsecbd { display: block; }

/* 17-5 P0 五分区互斥（优先级 t > b > c > a > p）
   同时有多个 open 时，只显示优先级最高的那个 */
.rlmain .rlsecbar:has(.rlsec[data-sec="a"][open]) .rlsec[data-sec="p"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec[data-sec="c"][open]) .rlsec[data-sec="p"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec[data-sec="b"][open]) .rlsec[data-sec="p"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec[data-sec="t"][open]) .rlsec[data-sec="p"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec[data-sec="c"][open]) .rlsec[data-sec="a"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec[data-sec="b"][open]) .rlsec[data-sec="a"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec[data-sec="t"][open]) .rlsec[data-sec="a"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec[data-sec="b"][open]) .rlsec[data-sec="c"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec[data-sec="t"][open]) .rlsec[data-sec="c"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec[data-sec="t"][open]) .rlsec[data-sec="b"] > .rlsecbd { display: none; }

/* 17-6 P3 三分区互斥（优先级 d > r > m） */
.rlmain .rlsecbar:has(.rlsec[data-sec="r"][open]) .rlsec[data-sec="m"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec[data-sec="d"][open]) .rlsec[data-sec="m"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec[data-sec="d"][open]) .rlsec[data-sec="r"] > .rlsecbd { display: none; }

/* 17-7 P1 NPC 八槽互斥（优先级 idx=7 > 6 > ... > 0） */
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="1"][open]) .rlsec-npc[data-idx="0"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="2"][open]) .rlsec-npc[data-idx="0"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="3"][open]) .rlsec-npc[data-idx="0"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="4"][open]) .rlsec-npc[data-idx="0"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="5"][open]) .rlsec-npc[data-idx="0"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="6"][open]) .rlsec-npc[data-idx="0"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="7"][open]) .rlsec-npc[data-idx="0"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec-npc[data-idx="2"][open]) .rlsec-npc[data-idx="1"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="3"][open]) .rlsec-npc[data-idx="1"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="4"][open]) .rlsec-npc[data-idx="1"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="5"][open]) .rlsec-npc[data-idx="1"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="6"][open]) .rlsec-npc[data-idx="1"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="7"][open]) .rlsec-npc[data-idx="1"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec-npc[data-idx="3"][open]) .rlsec-npc[data-idx="2"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="4"][open]) .rlsec-npc[data-idx="2"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="5"][open]) .rlsec-npc[data-idx="2"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="6"][open]) .rlsec-npc[data-idx="2"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="7"][open]) .rlsec-npc[data-idx="2"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec-npc[data-idx="4"][open]) .rlsec-npc[data-idx="3"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="5"][open]) .rlsec-npc[data-idx="3"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="6"][open]) .rlsec-npc[data-idx="3"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="7"][open]) .rlsec-npc[data-idx="3"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec-npc[data-idx="5"][open]) .rlsec-npc[data-idx="4"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="6"][open]) .rlsec-npc[data-idx="4"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="7"][open]) .rlsec-npc[data-idx="4"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec-npc[data-idx="6"][open]) .rlsec-npc[data-idx="5"] > .rlsecbd,
.rlmain .rlsecbar:has(.rlsec-npc[data-idx="7"][open]) .rlsec-npc[data-idx="5"] > .rlsecbd { display: none; }

.rlmain .rlsecbar:has(.rlsec-npc[data-idx="7"][open]) .rlsec-npc[data-idx="6"] > .rlsecbd { display: none; }

/* 17-8 summary 标签按钮样式
   接管原 label.rlseclbl 的外观，position:absolute 固钉定位 */
.rlmain .rlsec > summary.rlseclbl {
  position: absolute;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 36px;
  height: 34px;
  font-size: 0;
  color: transparent;
  list-style: none;
  cursor: pointer;
  background: linear-gradient(150deg, rgba(28, 36, 64, .88), rgba(14, 18, 32, .95));
  border: 1px solid var(--rl-line2);
  border-radius: 3px;
  transition: background .2s ease-out, border-color .2s ease-out, box-shadow .2s ease-out;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}

/* 去掉 summary 默认三角箭头 */
.rlmain .rlsec > summary.rlseclbl::-webkit-details-marker { display: none; }
.rlmain .rlsec > summary.rlseclbl::marker { content: ''; display: none; }

/* 图标伪元素 */
.rlmain .rlsec > summary.rlseclbl::before {
  content: '';
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  background-color: var(--rl-txt3);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 15px 15px;
  mask-size: 15px 15px;
  transition: background-color .2s ease-out, filter .2s ease-out, transform .22s var(--rl-ez-pop);
}

/* hover 态 */
.rlmain .rlsec > summary.rlseclbl:hover {
  background: linear-gradient(150deg, rgba(77, 208, 255, .16), rgba(14, 18, 32, .95));
  border-color: var(--rl-order-d);
  box-shadow: 0 0 10px rgba(77, 208, 255, .35), 0 0 20px rgba(77, 208, 255, .12);
}

.rlmain .rlsec > summary.rlseclbl:hover::before {
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 6px rgba(77, 208, 255, .9));
  transform: scale(1.12);
}

.rlmain .rlsec > summary.rlseclbl:active::before {
  transform: scale(.92);
}

/* hover tooltip（用 ::after 生成） */
.rlmain .rlsec > summary.rlseclbl::after {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 50;
  margin-top: 5px;
  padding: 3px 8px;
  font-size: 9px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: 1px;
  white-space: nowrap;
  background: rgba(8, 10, 16, .96);
  border: 1px solid var(--rl-order-d);
  border-radius: 2px;
  opacity: 0;
  transform: translate(-50%, -3px);
  pointer-events: none;
  transition: opacity .18s ease-out, transform .18s ease-out;
}

.rlmain .rlsec > summary.rlseclbl:hover::after {
  opacity: 1;
  transform: translate(-50%, 0);
}

/* 17-9 定位：nth-of-type 固钉（步进 41px） */
.rlmain .rlsecbar > .rlsec:nth-of-type(1) > summary.rlseclbl { left: 0; }
.rlmain .rlsecbar > .rlsec:nth-of-type(2) > summary.rlseclbl { left: 41px; }
.rlmain .rlsecbar > .rlsec:nth-of-type(3) > summary.rlseclbl { left: 82px; }
.rlmain .rlsecbar > .rlsec:nth-of-type(4) > summary.rlseclbl { left: 123px; }
.rlmain .rlsecbar > .rlsec:nth-of-type(5) > summary.rlseclbl { left: 164px; }
.rlmain .rlsecbar > .rlsec:nth-of-type(6) > summary.rlseclbl { left: 205px; }
.rlmain .rlsecbar > .rlsec:nth-of-type(7) > summary.rlseclbl { left: 246px; }
.rlmain .rlsecbar > .rlsec:nth-of-type(8) > summary.rlseclbl { left: 287px; }

/* 17-10 选中态（details[open]）：高亮 + 呼吸动画 + 底部发光条 */
.rlmain .rlsec[open] > summary.rlseclbl {
  border-color: var(--rl-order-d);
  background: linear-gradient(150deg, rgba(77, 208, 255, .2), rgba(14, 18, 32, .95));
  box-shadow: 0 0 12px rgba(77, 208, 255, .4), 0 0 24px rgba(77, 208, 255, .15);
}

.rlmain .rlsec[open] > summary.rlseclbl::before {
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 7px rgba(77, 208, 255, .95));
  animation: rlIconBreath 2.6s ease-in-out infinite;
}

/* 选中态 ::after 切换为底部发光条（覆盖 tooltip 定位） */
.rlmain .rlsec[open] > summary.rlseclbl::after {
  content: '';
  position: absolute;
  top: auto;
  bottom: -2px;
  left: 15%;
  margin-top: 0;
  padding: 0;
  width: 70%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--rl-order), transparent);
  border: 0;
  border-radius: 0;
  filter: drop-shadow(0 0 4px rgba(77, 208, 255, .9));
  opacity: 1;
  transform: none;
  pointer-events: none;
}

/* 17-12 内容区动画 */
.rlmain .rlsecbd {
  box-sizing: border-box;
  padding: 6px 0 0;
  animation: rlSecIn .32s var(--rl-ez-pop) both;
}

@keyframes rlSecIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.rlmain .rlsecbd > .rlcard {
  margin: 0 0 9px;
}

/* 17-13 tooltip 文字穷举（data-sec 穷举） */
.rlmain .rlsec[data-sec="p"] > summary.rlseclbl::after { content: '基础档案'; }
.rlmain .rlsec[data-sec="a"] > summary.rlseclbl::after { content: '属性面板'; }
.rlmain .rlsec[data-sec="c"] > summary.rlseclbl::after { content: '战斗配置'; }
.rlmain .rlsec[data-sec="b"] > summary.rlseclbl::after { content: '据点'; }
.rlmain .rlsec[data-sec="t"] > summary.rlseclbl::after { content: '冒险团'; }
.rlmain .rlsec[data-sec="m"] > summary.rlseclbl::after { content: '世界与任务'; }
.rlmain .rlsec[data-sec="r"] > summary.rlseclbl::after { content: '大区'; }
.rlmain .rlsec[data-sec="d"] > summary.rlseclbl::after { content: '小区'; }

/* 选中态覆盖 tooltip（切为发光条，特异性 0,5,1 压过上方穷举） */
.rlmain .rlsec[data-sec="p"][open] > summary.rlseclbl::after,
.rlmain .rlsec[data-sec="a"][open] > summary.rlseclbl::after,
.rlmain .rlsec[data-sec="c"][open] > summary.rlseclbl::after,
.rlmain .rlsec[data-sec="b"][open] > summary.rlseclbl::after,
.rlmain .rlsec[data-sec="t"][open] > summary.rlseclbl::after,
.rlmain .rlsec[data-sec="m"][open] > summary.rlseclbl::after,
.rlmain .rlsec[data-sec="r"][open] > summary.rlseclbl::after,
.rlmain .rlsec[data-sec="d"][open] > summary.rlseclbl::after {
  content: '';
  position: absolute;
  top: auto;
  bottom: -2px;
  left: 15%;
  margin-top: 0;
  padding: 0;
  width: 70%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--rl-order), transparent);
  border: 0;
  border-radius: 0;
  filter: drop-shadow(0 0 4px rgba(77, 208, 255, .9));
  opacity: 1;
  transform: none;
  pointer-events: none;
}

/* 17-13 图标组（P0五组 + P3三组，data-sec穷举） */

/* 基础档案 - 身份卡 */
.rlmain .rlsec[data-sec="p"] > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='3' width='16' height='18' rx='1.6' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='10' r='3' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M7.4 18.6c0-2.6 2.1-4.4 4.6-4.4s4.6 1.8 4.6 4.4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='3' width='16' height='18' rx='1.6' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='10' r='3' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M7.4 18.6c0-2.6 2.1-4.4 4.6-4.4s4.6 1.8 4.6 4.4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 属性面板 - 六芒星 */
.rlmain .rlsec[data-sec="a"] > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4 14.8 8.6 21.6 9.6 16.8 14.2 18 21 12 17.8 6 21 7.2 14.2 2.4 9.6 9.2 8.6Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4 14.8 8.6 21.6 9.6 16.8 14.2 18 21 12 17.8 6 21 7.2 14.2 2.4 9.6 9.2 8.6Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* 战斗配置 - 交叉剑 */
.rlmain .rlsec[data-sec="c"] > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.4 3.6V7l3.4 3.4h3.4M6.2 17.8l11.6-11.6M9.6 3.6V7L6.2 10.4H2.8M17.8 17.8L6.2 6.2' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.2 14.8l2 2M14.8 7.2l2 2' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.4 3.6V7l3.4 3.4h3.4M6.2 17.8l11.6-11.6M9.6 3.6V7L6.2 10.4H2.8M17.8 17.8L6.2 6.2' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.2 14.8l2 2M14.8 7.2l2 2' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 据点 - 塔楼 */
.rlmain .rlsec[data-sec="b"] > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.4 21V9.6L12 4.2l6.6 5.4V21Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9.6 21v-5.4h4.8V21' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M9 11.4h1.8M13.2 11.4H15' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.4 21V9.6L12 4.2l6.6 5.4V21Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9.6 21v-5.4h4.8V21' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M9 11.4h1.8M13.2 11.4H15' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 冒险团 - 旗帜 */
.rlmain .rlsec[data-sec="t"] > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3v18' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3Cpath d='M6 4.2h12.6l-3.6 4.2 3.6 4.2H6' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3v18' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3Cpath d='M6 4.2h12.6l-3.6 4.2 3.6 4.2H6' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* 世界与任务 - 任务卷轴 */
.rlmain .rlsec[data-sec="m"] > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.2 3.6c-1.4 0-2.6.8-2.6 1.8v13.2c0 1 1.2 1.8 2.6 1.8h9.6c1.4 0 2.6-.8 2.6-1.8V5.4c0-1-1.2-1.8-2.6-1.8Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9 8.4h6M9 12h4.8M9 15.6h3' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.2 3.6c-1.4 0-2.6.8-2.6 1.8v13.2c0 1 1.2 1.8 2.6 1.8h9.6c1.4 0 2.6-.8 2.6-1.8V5.4c0-1-1.2-1.8-2.6-1.8Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9 8.4h6M9 12h4.8M9 15.6h3' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 大区 - 罗盘地图 */
.rlmain .rlsec[data-sec="r"] > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M12 3v3.6M12 17.4V21M3 12h3.6M17.4 12H21' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M14.8 9.2l-6.6 2 2 6.6 6.6-2Z' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M12 3v3.6M12 17.4V21M3 12h3.6M17.4 12H21' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M14.8 9.2l-6.6 2 2 6.6 6.6-2Z' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* 小区 - 建筑群 */
.rlmain .rlsec[data-sec="d"] > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.6 20V10.8h5.4V20M9 20V6h6v14M15 20V10.8h5.4V20' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M11.2 9h1.6M11.2 12.6h1.6M11.2 16.2h1.6M5.2 13.8h1.8M16.8 13.8h1.8' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.6 20V10.8h5.4V20M9 20V6h6v14M15 20V10.8h5.4V20' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M11.2 9h1.6M11.2 12.6h1.6M11.2 16.2h1.6M5.2 13.8h1.8M16.8 13.8h1.8' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 17-15 窄屏适配 */
@container rlbox (max-width: 350px) {
  .rlmain .rlsec > summary.rlseclbl {
    width: 30px;
    height: 28px;
  }
  .rlmain .rlsec > summary.rlseclbl::before {
    width: 13px;
    height: 13px;
    -webkit-mask-size: 13px 13px;
    mask-size: 13px 13px;
  }
  .rlmain .rlsecbar {
    padding-top: 36px;
    min-height: 36px;
  }
  .rlmain .rlsecbar > .rlsec:nth-of-type(1) > summary.rlseclbl { left: 0; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(2) > summary.rlseclbl { left: 35px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(3) > summary.rlseclbl { left: 70px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(4) > summary.rlseclbl { left: 105px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(5) > summary.rlseclbl { left: 140px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(6) > summary.rlseclbl { left: 175px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(7) > summary.rlseclbl { left: 210px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(8) > summary.rlseclbl { left: 245px; }
  .rlmain .rlsec > summary.rlseclbl::after,
  .rlmain .rlsec-npc > summary.rlseclbl > span { display: none; }
}

@media (max-width: 390px) {
  .rlmain .rlsec > summary.rlseclbl {
    width: 30px;
    height: 28px;
  }
  .rlmain .rlsec > summary.rlseclbl::before {
    width: 13px;
    height: 13px;
    -webkit-mask-size: 13px 13px;
    mask-size: 13px 13px;
  }
  .rlmain .rlsecbar {
    padding-top: 36px;
    min-height: 36px;
  }
  .rlmain .rlsecbar > .rlsec:nth-of-type(1) > summary.rlseclbl { left: 0; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(2) > summary.rlseclbl { left: 35px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(3) > summary.rlseclbl { left: 70px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(4) > summary.rlseclbl { left: 105px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(5) > summary.rlseclbl { left: 140px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(6) > summary.rlseclbl { left: 175px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(7) > summary.rlseclbl { left: 210px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(8) > summary.rlseclbl { left: 245px; }
}

/* 17-11 NPC 标签阵营色 */
.rlmain .rlsec-npc[nfc="order"] { --rlnc: 77, 208, 255; --rlncs: var(--rl-order); --rlncd: var(--rl-order-d); }
.rlmain .rlsec-npc[nfc="chaos"] { --rlnc: 255, 45, 85; --rlncs: var(--rl-chaos); --rlncd: var(--rl-chaos-d); }
.rlmain .rlsec-npc[nfc="nature"] { --rlnc: 61, 220, 151; --rlncs: var(--rl-nature); --rlncd: var(--rl-nature-d); }
.rlmain .rlsec-npc[nfc="none"] { --rlnc: 122, 138, 168; --rlncs: var(--rl-txt2); --rlncd: var(--rl-line2); }

.rlmain .rlsec-npc > summary.rlseclbl {
  border-color: rgba(var(--rlnc), .4);
}

.rlmain .rlsec-npc > summary.rlseclbl:hover {
  border-color: rgba(var(--rlnc), .7);
  box-shadow: 0 0 10px rgba(var(--rlnc), .35), 0 0 20px rgba(var(--rlnc), .12);
  background: linear-gradient(150deg, rgba(var(--rlnc), .15), rgba(14, 18, 32, .95));
}

.rlmain .rlsec-npc > summary.rlseclbl:hover::before {
  background-color: var(--rlncs);
  filter: drop-shadow(0 0 6px rgba(var(--rlnc), .9));
}

/* NPC 角色名 tooltip */
.rlmain .rlsec-npc > summary.rlseclbl > span {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 50;
  margin-top: 5px;
  padding: 3px 8px;
  font-size: 9px;
  font-weight: 700;
  color: var(--rlncs);
  letter-spacing: 1px;
  white-space: nowrap;
  background: rgba(8, 10, 16, .96);
  border: 1px solid var(--rlncd);
  border-radius: 2px;
  opacity: 0;
  transform: translate(-50%, -3px);
  pointer-events: none;
  transition: opacity .18s ease-out, transform .18s ease-out;
}

.rlmain .rlsec-npc > summary.rlseclbl:hover > span {
  opacity: 1;
  transform: translate(-50%, 0);
}

/* NPC 选中态 */
.rlmain .rlsec-npc[open] > summary.rlseclbl {
  border-color: rgba(var(--rlnc), .6);
  background: linear-gradient(150deg, rgba(var(--rlnc), .2), rgba(14, 18, 32, .95));
  box-shadow: 0 0 12px rgba(var(--rlnc), .4), 0 0 24px rgba(var(--rlnc), .15);
}

.rlmain .rlsec-npc[open] > summary.rlseclbl::before {
  background-color: var(--rlncs);
  filter: drop-shadow(0 0 7px rgba(var(--rlnc), .95));
}

.rlmain .rlsec-npc[open] > summary.rlseclbl::after {
  content: '';
  position: absolute;
  top: auto;
  bottom: -2px;
  left: 15%;
  margin-top: 0;
  padding: 0;
  width: 70%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--rlncs), transparent);
  border: 0;
  border-radius: 0;
  filter: drop-shadow(0 0 4px rgba(var(--rlnc), .9));
  opacity: 1;
  transform: none;
  pointer-events: none;
}

/* 选中时隐藏角色名 tooltip */
.rlmain .rlsec-npc[open] > summary.rlseclbl > span {
  opacity: 0;
  pointer-events: none;
}

/* 17-14 NPC 八种图标轮换（nth-of-type） */

/* 1 · 标准人形 */
.rlmain .rlsec-npc:nth-of-type(8n+1) > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.6' r='3.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.8 20c0-3.4 2.8-5.8 6.2-5.8s6.2 2.4 6.2 5.8' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.6' r='3.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.8 20c0-3.4 2.8-5.8 6.2-5.8s6.2 2.4 6.2 5.8' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 2 · 兜帽人形 */
.rlmain .rlsec-npc:nth-of-type(8n+2) > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3C8.8 3 7 5.8 7 8.4c0 1.4.5 2.6 1.4 3.4L6.6 20h10.8l-1.8-8.2c.9-.8 1.4-2 1.4-3.4C17 5.8 15.2 3 12 3Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='9.2' r='2.2' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3C8.8 3 7 5.8 7 8.4c0 1.4.5 2.6 1.4 3.4L6.6 20h10.8l-1.8-8.2c.9-.8 1.4-2 1.4-3.4C17 5.8 15.2 3 12 3Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='9.2' r='2.2' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
}

/* 3 · 带角/恶魔 */
.rlmain .rlsec-npc:nth-of-type(8n+3) > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.2 4.2l1.4 3.4M15.8 4.2l-1.4 3.4' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='10' r='3' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M6.4 20c0-3.2 2.5-5.4 5.6-5.4s5.6 2.2 5.6 5.4' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.2 4.2l1.4 3.4M15.8 4.2l-1.4 3.4' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='10' r='3' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M6.4 20c0-3.2 2.5-5.4 5.6-5.4s5.6 2.2 5.6 5.4' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 4 · 长发女性 */
.rlmain .rlsec-npc:nth-of-type(8n+4) > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M8.2 6.6c-.2-2.4 1.6-4 3.8-4s4 1.6 3.8 4' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M8 8.2c-.8 1.4-1.2 3.4-.8 5.8M16 8.2c.8 1.4 1.2 3.4.8 5.8' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M6.4 20c0-3 2.5-5 5.6-5s5.6 2 5.6 5' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M8.2 6.6c-.2-2.4 1.6-4 3.8-4s4 1.6 3.8 4' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M8 8.2c-.8 1.4-1.2 3.4-.8 5.8M16 8.2c.8 1.4 1.2 3.4.8 5.8' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M6.4 20c0-3 2.5-5 5.6-5s5.6 2 5.6 5' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 5 · 重甲宽肩 */
.rlmain .rlsec-npc:nth-of-type(8n+5) > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.4' r='2.8' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M4.2 20V14c0-2.4 3.5-4.2 7.8-4.2s7.8 1.8 7.8 4.2v6' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M8.4 13.4h7.2' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.4' r='2.8' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M4.2 20V14c0-2.4 3.5-4.2 7.8-4.2s7.8 1.8 7.8 4.2v6' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M8.4 13.4h7.2' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 6 · 法师/法杖 */
.rlmain .rlsec-npc:nth-of-type(8n+6) > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.4' cy='8' r='2.8' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M5 20c0-3 2.4-5.2 5.4-5.2s5.4 2.2 5.4 5.2' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M18.4 3.6v15M17 4.6h2.8M17.6 6.2h1.6' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.4' cy='8' r='2.8' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M5 20c0-3 2.4-5.2 5.4-5.2s5.4 2.2 5.4 5.2' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M18.4 3.6v15M17 4.6h2.8M17.6 6.2h1.6' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 7 · 双持/刺客 */
.rlmain .rlsec-npc:nth-of-type(8n+7) > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.2' r='2.6' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M6.6 20c0-3 2.4-5 5.4-5s5.4 2 5.4 5' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3Cpath d='M5.4 8.4l3.2 4.8M18.6 8.4l-3.2 4.8' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.2' r='2.6' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M6.6 20c0-3 2.4-5 5.4-5s5.4 2 5.4 5' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3Cpath d='M5.4 8.4l3.2 4.8M18.6 8.4l-3.2 4.8' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 8 · 小体型/伙伴 */
.rlmain .rlsec-npc:nth-of-type(8n+8) > summary.rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8.4' r='2.6' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M4.4 19c0-2.6 2-4.4 4.6-4.4s4.6 1.8 4.6 4.4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3Cpath d='M15.6 6.8a2 2 0 1 1 0 4M16.2 14c2 .2 3.6 1.8 3.6 3.8' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8.4' r='2.6' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M4.4 19c0-2.6 2-4.4 4.6-4.4s4.6 1.8 4.6 4.4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3Cpath d='M15.6 6.8a2 2 0 1 1 0 4M16.2 14c2 .2 3.6 1.8 3.6 3.8' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* ============================================================
   20. CG立绘展示区 · CHARACTER GALLERY
   命名空间 rlcg · 追加至内置CSS末尾
   ============================================================ */

/* ---------- 立绘容器 ---------- */
.rlmain .rlcg {
  position: relative;
  width: 100%;
  margin: 14px 0 4px;
  overflow: hidden;
  border: 1px solid var(--rl-line2);
  border-radius: 3px;
  background: var(--rl-bg1);
  transition: border-color .25s ease-out, box-shadow .25s ease-out;
}

.rlmain .rlcg:hover {
  border-color: var(--rl-order-d);
  box-shadow: 0 0 14px rgba(77, 208, 255, .2), 0 4px 16px rgba(0, 0, 0, .5);
}

/* 左上角CG标签 */
.rlmain .rlcg::before {
  content: 'CG';
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 5;
  padding: 2px 8px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 9px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: 1.8px;
  background: rgba(8, 10, 16, .78);
  border: 1px solid rgba(77, 208, 255, .35);
  border-radius: 2px;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  pointer-events: none;
  transition: color .2s ease-out, border-color .2s ease-out;
}

/* 底部渐变收束 */
.rlmain .rlcg::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 36px;
  background: linear-gradient(180deg, transparent, rgba(5, 7, 12, .65));
  pointer-events: none;
  z-index: 2;
}

/* ---------- 图片通用 ---------- */
.rlmain .rlcg-img {
  width: 100%;
  aspect-ratio: 3/4;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  background-color: var(--rl-bg2);
}

/* 性爱CG默认隐藏 */
.rlmain .rlcg-h {
  display: none;
}

/* ---------- 切换按钮（details）---------- */

/* 默认显示（常态图为主，点击切换至性爱图）*/
.rlmain .rlcg-sw {
  display: block;
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 10;
}

/* summary去掉默认样式 */
.rlmain .rlcg-sw > summary::-webkit-details-marker { display: none; }
.rlmain .rlcg-sw > summary::marker { content: ''; display: none; }

/* 按钮外观 */
.rlmain .rlcg-sw > summary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  list-style: none;
  cursor: pointer;
  background: rgba(8, 10, 16, .78);
  border: 1px solid rgba(77, 208, 255, .4);
  border-radius: 50%;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transition: background .2s ease-out, border-color .2s ease-out, transform .2s var(--rl-ez-pop), box-shadow .2s ease-out;
  -webkit-tap-highlight-color: transparent;
}

.rlmain .rlcg-sw > summary:hover {
  background: rgba(77, 208, 255, .18);
  border-color: var(--rl-order);
  transform: scale(1.1);
  box-shadow: 0 0 12px rgba(77, 208, 255, .5);
}

.rlmain .rlcg-sw > summary:active {
  transform: scale(.92);
}

/* 按钮图标 —— 循环切换箭头 */
.rlmain .rlcg-sw > summary::before {
  content: '';
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  background-color: var(--rl-order);
  filter: drop-shadow(0 0 4px rgba(77, 208, 255, .6));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M171l4 4-4 4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3 11V9a4 4 0 0 1 4-4h14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M7 23l-4-4 4-4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M21 13v2a4 4 0 0 1-4 4H3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17 1l4 4-4 4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3 11V9a4 4 0 0 1 4-4h14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M7 23l-4-4 4-4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M21 13v2a4 4 0 0 1-4 4H3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  -webkit-mask-size: 16px 16px;
  mask-size: 16px 16px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: background-color .2s ease-out, filter .2s ease-out;
}

/* ---------- 展开态（性爱CG显示中）---------- */
.rlmain .rlcg-sw[open] > summary {
  border-color: rgba(255, 45, 85, .6);
  background: rgba(255, 45, 85, .2);
  box-shadow: 0 0 12px rgba(255, 45, 85, .4);
}

.rlmain .rlcg-sw[open] > summary::before {
  background-color: var(--rl-chaos);
  filter: drop-shadow(0 0 5px rgba(255, 45, 85, .8));
}

.rlmain .rlcg-sw[open] > summary:hover {
  background: rgba(255, 45, 85, .32);
  border-color: var(--rl-chaos);
  box-shadow: 0 0 16px rgba(255, 45, 85, .6);
}

/* ---------- CG切换逻辑 ---------- */
.rlmain .rlcg:has(.rlcg-sw[open]) .rlcg-n {
  display: none;
}

.rlmain .rlcg:has(.rlcg-sw[open]) .rlcg-h {
  display: block;
}

/* 标签跟随变色 */
.rlmain .rlcg:has(.rlcg-sw[open])::before {
  content: 'CG·H';
  color: var(--rl-chaos);
  border-color: rgba(255, 45, 85, .4);
}

/* ----------裁剪保护 ---------- */
.rlmain .rlcard:has(.rlcg-sw[open]) {
  clip-path: none;
}

/* ---------- 窄屏适配 ---------- */
@container rlbox (max-width: 350px) {
  .rlmain .rlcg-img {
    aspect-ratio: 2/3;
  }
  .rlmain .rlcg-sw > summary {
    width: 30px;
    height: 30px;
  }
  .rlmain .rlcg-sw > summary::before {
    width: 14px;
    height: 14px;
    -webkit-mask-size: 14px 14px;
    mask-size: 14px 14px;
  }
}

/* ---------- 角色图片指定（创作者按需填入直链）---------- */
/* 示例：
.rlmain .rlcg[cg="vera"] .rlcg-n {
  background-image: url('https://xxx.com/vera-normal.jpg');
}
.rlmain .rlcg[cg="vera"] .rlcg-h {
  background-image: url('https://xxx.com/vera-nsfw.jpg');
}
*/

/* ---------- 角色CG立绘映射（常态 rlcg-n / 性爱 rlcg-h）---------- */
/* 陈知意 */
.rlmain .rlcg[cg="chenzhiyi"] .rlcg-n { background-image: url('https://i.ibb.co/WWGPJS1f/image.png'); }
.rlmain .rlcg[cg="chenzhiyi"] .rlcg-h { background-image: url('https://i.ibb.co/ZRtTjV1q/1.png'); }
/* 顾清和 */
.rlmain .rlcg[cg="guqinghe"] .rlcg-n { background-image: url('https://i.ibb.co/ywdTKSg/image.png'); }
.rlmain .rlcg[cg="guqinghe"] .rlcg-h { background-image: url('https://i.ibb.co/VYwYR6nX/1.png'); }
/* 顾素锦 */
.rlmain .rlcg[cg="gusujin"] .rlcg-n { background-image: url('https://i.ibb.co/wFjTSQy6/image.png'); }
.rlmain .rlcg[cg="gusujin"] .rlcg-h { background-image: url('https://i.ibb.co/SXy9bC6y/2.png'); }
/* 凌金瑶 */
.rlmain .rlcg[cg="lingjinyao"] .rlcg-n { background-image: url('https://i.ibb.co/tyjkG1d/image.png'); }
.rlmain .rlcg[cg="lingjinyao"] .rlcg-h { background-image: url('https://i.ibb.co/gZKtwLLw/1.png'); }
/* 陆雪晶 */
.rlmain .rlcg[cg="luxuejing"] .rlcg-n { background-image: url('https://i.ibb.co/0pZ7LhkD/image.png'); }
.rlmain .rlcg[cg="luxuejing"] .rlcg-h { background-image: url('https://i.ibb.co/PZ8SvrCx/1.png'); }
/* 孟书冉 */
.rlmain .rlcg[cg="mengshuran"] .rlcg-n { background-image: url('https://i.ibb.co/yFS1bBSF/image.png'); }
.rlmain .rlcg[cg="mengshuran"] .rlcg-h { background-image: url('https://i.ibb.co/Z6gZ114c/1.png'); }
/* 宁依玄 */
.rlmain .rlcg[cg="ningyixuan"] .rlcg-n { background-image: url('https://i.ibb.co/r2CTsnJ2/image.png'); }
.rlmain .rlcg[cg="ningyixuan"] .rlcg-h { background-image: url('https://i.ibb.co/jk7LkQdw/1.png'); }
/* 苏沐璃 */
.rlmain .rlcg[cg="sumuli"] .rlcg-n { background-image: url('https://i.ibb.co/Z5Nxb1t/image.png'); }
.rlmain .rlcg[cg="sumuli"] .rlcg-h { background-image: url('https://i.ibb.co/wrQ5chyq/1.png'); }
/* 叶婉刃 */
.rlmain .rlcg[cg="yewanren"] .rlcg-n { background-image: url('https://i.ibb.co/kk0GTXN/image.png'); }
.rlmain .rlcg[cg="yewanren"] .rlcg-h { background-image: url('https://i.ibb.co/fVrXpn7k/2.png'); }
/* 玉凝香 */
.rlmain .rlcg[cg="yuningxiang"] .rlcg-n { background-image: url('https://i.ibb.co/8ynBHws/image.png'); }
.rlmain .rlcg[cg="yuningxiang"] .rlcg-h { background-image: url('https://i.ibb.co/ccwHm3BD/1.png'); }
/* 白兰芷 */
.rlmain .rlcg[cg="bailanzhi"] .rlcg-n { background-image: url('https://i.ibb.co/zWjwtxgV/image.png'); }
.rlmain .rlcg[cg="bailanzhi"] .rlcg-h { background-image: url('https://i.ibb.co/Jwg65kCr/1.png'); }
/* 步瑶光 */
.rlmain .rlcg[cg="buyaoguang"] .rlcg-n { background-image: url('https://i.ibb.co/23921Kg4/image.png'); }
.rlmain .rlcg[cg="buyaoguang"] .rlcg-h { background-image: url('https://i.ibb.co/vxWtdvFQ/1.png'); }
/* 陈梦曦 */
.rlmain .rlcg[cg="chenmengxi"] .rlcg-n { background-image: url('https://i.ibb.co/vCHf3nz7/image.png'); }
.rlmain .rlcg[cg="chenmengxi"] .rlcg-h { background-image: url('https://i.ibb.co/MkCGCVzn/1.png'); }
/* 宫紫苑 */
.rlmain .rlcg[cg="gongziyuan"] .rlcg-n { background-image: url('https://i.ibb.co/3yXLXGF3/image.png'); }
.rlmain .rlcg[cg="gongziyuan"] .rlcg-h { background-image: url('https://i.ibb.co/05NkNs8/1.png'); }
/* 华素 */
.rlmain .rlcg[cg="huasu"] .rlcg-n { background-image: url('https://i.ibb.co/QRYghgS/image.png'); }
.rlmain .rlcg[cg="huasu"] .rlcg-h { background-image: url('https://i.ibb.co/Y4NRT13Z/1.png'); }
/* 李栖鸾 */
.rlmain .rlcg[cg="liqiluan"] .rlcg-n { background-image: url('https://i.ibb.co/fz3mD0nK/image.png'); }
.rlmain .rlcg[cg="liqiluan"] .rlcg-h { background-image: url('https://i.ibb.co/20pL2cHS/1.png'); }
/* 林海棠 */
.rlmain .rlcg[cg="linhaitang"] .rlcg-n { background-image: url('https://i.ibb.co/7xpRM4Fm/image.png'); }
.rlmain .rlcg[cg="linhaitang"] .rlcg-h { background-image: url('https://i.ibb.co/DHQYHHK8/1.png'); }
/* 柳扶摇 */
.rlmain .rlcg[cg="liufuyao"] .rlcg-n { background-image: url('https://i.ibb.co/Pzv3PVBg/image.png'); }
.rlmain .rlcg[cg="liufuyao"] .rlcg-h { background-image: url('https://i.ibb.co/C3fkH8tR/1.png'); }
/* 柳如烟 */
.rlmain .rlcg[cg="liuruyan"] .rlcg-n { background-image: url('https://i.ibb.co/274Jc9dr/image.png'); }
.rlmain .rlcg[cg="liuruyan"] .rlcg-h { background-image: url('https://i.ibb.co/jvqqQ39q/1.png'); }
/* 穆珠 */
.rlmain .rlcg[cg="muzhu"] .rlcg-n { background-image: url('https://i.ibb.co/B5fyj5cy/image.png'); }
.rlmain .rlcg[cg="muzhu"] .rlcg-h { background-image: url('https://i.ibb.co/4nyXVkYG/1.png'); }
/* 欧阳倩 */
.rlmain .rlcg[cg="ouyangqian"] .rlcg-n { background-image: url('https://i.ibb.co/39JLVmPw/image.png'); }
.rlmain .rlcg[cg="ouyangqian"] .rlcg-h { background-image: url('https://i.ibb.co/67t1g4sG/1.png'); }
/* 皮燕子 */
.rlmain .rlcg[cg="piyanzi"] .rlcg-n { background-image: url('https://i.ibb.co/XZ24Wqgn/image.png'); }
.rlmain .rlcg[cg="piyanzi"] .rlcg-h { background-image: url('https://i.ibb.co/tpVC8vq9/1.png'); }
/* 秦穆 */
.rlmain .rlcg[cg="qinmu"] .rlcg-n { background-image: url('https://i.ibb.co/DTpN7Kq/image.png'); }
.rlmain .rlcg[cg="qinmu"] .rlcg-h { background-image: url('https://i.ibb.co/1YbwwhWh/1.png'); }
/* 宋魅 */
.rlmain .rlcg[cg="songmei"] .rlcg-n { background-image: url('https://i.ibb.co/xKbGvK2Q/image.png'); }
.rlmain .rlcg[cg="songmei"] .rlcg-h { background-image: url('https://i.ibb.co/rR2Wr0hp/1.png'); }
/* 宋绮罗 */
.rlmain .rlcg[cg="songqiluo"] .rlcg-n { background-image: url('https://i.ibb.co/5hxmHX7Q/image.png'); }
.rlmain .rlcg[cg="songqiluo"] .rlcg-h { background-image: url('https://i.ibb.co/1fMvhnZW/1.png'); }
/* 苏狂娇 */
.rlmain .rlcg[cg="sukuangjiao"] .rlcg-n { background-image: url('https://i.ibb.co/9kt7W6yM/image.png'); }
.rlmain .rlcg[cg="sukuangjiao"] .rlcg-h { background-image: url('https://i.ibb.co/MynQnWJR/1.png'); }
/* 苏凝语 */
.rlmain .rlcg[cg="suningyu"] .rlcg-n { background-image: url('https://i.ibb.co/SCwSz7p/image.png'); }
.rlmain .rlcg[cg="suningyu"] .rlcg-h { background-image: url('https://i.ibb.co/nsV78f9j/1.png'); }
/* 苏婉儿 */
.rlmain .rlcg[cg="suwaner"] .rlcg-n { background-image: url('https://i.ibb.co/G4gB1CN2/image.png'); }
.rlmain .rlcg[cg="suwaner"] .rlcg-h { background-image: url('https://i.ibb.co/kgMSDtD0/1.png'); }
/* 萧银雪 */
.rlmain .rlcg[cg="xiaoyinxue"] .rlcg-n { background-image: url('https://i.ibb.co/SbTw2XS/image.png'); }
.rlmain .rlcg[cg="xiaoyinxue"] .rlcg-h { background-image: url('https://i.ibb.co/0yFXyXXb/1.png'); }
/* 叶小曼 */
.rlmain .rlcg[cg="yexiaoman"] .rlcg-n { background-image: url('https://i.ibb.co/rRbJbfq8/image.png'); }
.rlmain .rlcg[cg="yexiaoman"] .rlcg-h { background-image: url('https://i.ibb.co/rnpFX1S/1.png'); }
/* 殷绛唇 */
.rlmain .rlcg[cg="yinjiangchun"] .rlcg-n { background-image: url('https://i.ibb.co/cK9yRV6H/image.png'); }
.rlmain .rlcg[cg="yinjiangchun"] .rlcg-h { background-image: url('https://i.ibb.co/vxM5V4ng/1.png'); }
/* 虞静姝 */
.rlmain .rlcg[cg="yujingshu"] .rlcg-n { background-image: url('https://i.ibb.co/PZwTK8v7/image.png'); }
.rlmain .rlcg[cg="yujingshu"] .rlcg-h { background-image: url('https://i.ibb.co/K3c17dk/1.png'); }
/* 云清霜 */
.rlmain .rlcg[cg="yunqingshuang"] .rlcg-n { background-image: url('https://i.ibb.co/LdKx2SQ5/image.png'); }
.rlmain .rlcg[cg="yunqingshuang"] .rlcg-h { background-image: url('https://i.ibb.co/HTm6WJyG/1.png'); }
/* 诸葛婻 */
.rlmain .rlcg[cg="zhugehan"] .rlcg-n { background-image: url('https://i.ibb.co/9HnrDG11/image.png'); }
.rlmain .rlcg[cg="zhugehan"] .rlcg-h { background-image: url('https://i.ibb.co/mF0M2M2C/1.png'); }
/* ========== 轮回乐园角色CG立绘映射 ========== */
/* 苏晓 */
.rlmain .rlcg[cg="suxiao"] .rlcg-n { background-image: url('https://i.ibb.co/k23Fpcrk/b93c3442-6a0f-451f-9006-1573225ab97d.png'); }
.rlmain .rlcg[cg="suxiao"] .rlcg-h { background-image: url('https://i.ibb.co/CLstG13/2fe6cb63-9498-435f-b216-dd9a9e4e7852.png'); }
/* 布布汪 */
.rlmain .rlcg[cg="bubuwang"] .rlcg-n { background-image: url('https://i.ibb.co/Rp6h65L8/image.png'); }
/* 巴哈 */
.rlmain .rlcg[cg="baha"] .rlcg-n { background-image: url('https://i.ibb.co/DDd71fR8/image.png'); }
/* 阿姆 */
.rlmain .rlcg[cg="amu"] .rlcg-n { background-image: url('https://i.ibb.co/V02RwD1c/image.png'); }
/* 贝妮 */
.rlmain .rlcg[cg="beini"] .rlcg-n { background-image: url('https://i.ibb.co/gbX3Gr4v/image.png'); }
/* 棘拉 */
.rlmain .rlcg[cg="jila"] .rlcg-n { background-image: url('https://i.ibb.co/dsXCpdQH/image.png'); }
.rlmain .rlcg[cg="jila"] .rlcg-h { background-image: url('https://i.ibb.co/xSCZ2s67/1.png'); }
/* 团长 */
.rlmain .rlcg[cg="tuanzhang"] .rlcg-n { background-image: url('https://i.ibb.co/p6t4Qgb6/image.png'); }
/* 控偶师 */
.rlmain .rlcg[cg="kongoushi"] .rlcg-n { background-image: url('https://i.ibb.co/ksK9rWnN/image.png'); }
.rlmain .rlcg[cg="kongoushi"] .rlcg-h { background-image: url('https://i.ibb.co/4RyHhQ54/1.png'); }
/* 魔女 */
.rlmain .rlcg[cg="monv"] .rlcg-n { background-image: url('https://i.ibb.co/b554BPLj/image.png'); }
.rlmain .rlcg[cg="monv"] .rlcg-h { background-image: url('https://i.ibb.co/j9x1JLy3/1.png'); }
/* 咕噜 */
.rlmain .rlcg[cg="gulu"] .rlcg-n { background-image: url('https://i.ibb.co/CK564B73/image.png'); }
.rlmain .rlcg[cg="gulu"] .rlcg-h { background-image: url('https://i.ibb.co/B2fqbf4M/1.png'); }
/* J先生 */
.rlmain .rlcg[cg="jxiansheng"] .rlcg-n { background-image: url('https://i.ibb.co/1fKsmN3k/J.png'); }
/* 莎 */
.rlmain .rlcg[cg="sha"] .rlcg-n { background-image: url('https://i.ibb.co/zdZ6dtP/image.png'); }
.rlmain .rlcg[cg="sha"] .rlcg-h { background-image: url('https://i.ibb.co/qVp7zvT/1.png'); }
/* 黑蔷薇 */
.rlmain .rlcg[cg="heiqiangwei"] .rlcg-n { background-image: url('https://i.ibb.co/svCSdG76/image.png'); }
.rlmain .rlcg[cg="heiqiangwei"] .rlcg-h { background-image: url('https://i.ibb.co/7dGCwn1K/1.png'); }
/* 狠人兄 */
.rlmain .rlcg[cg="henrenxiong"] .rlcg-n { background-image: url('https://i.ibb.co/bgCgmwVv/image.png'); }
/* 希儿 */
.rlmain .rlcg[cg="xier"] .rlcg-n { background-image: url('https://i.ibb.co/wFmXL35k/image.png'); }
.rlmain .rlcg[cg="xier"] .rlcg-h { background-image: url('https://i.ibb.co/k6QDPxdg/1.png'); }
/* 亡灵妹 */
.rlmain .rlcg[cg="wanglingmei"] .rlcg-n { background-image: url('https://i.ibb.co/B2h98nQb/image.png'); }
.rlmain .rlcg[cg="wanglingmei"] .rlcg-h { background-image: url('https://i.ibb.co/qM318npg/1.png'); }
/* 夏 */
.rlmain .rlcg[cg="xia"] .rlcg-n { background-image: url('https://i.ibb.co/rGD8rdzh/image.png'); }
.rlmain .rlcg[cg="xia"] .rlcg-h { background-image: url('https://i.ibb.co/yjdp20F/1.png'); }
/* 尼古拉斯·凯撒 */
.rlmain .rlcg[cg="nigulasi"] .rlcg-n { background-image: url('https://i.ibb.co/TqpGn34W/image.png'); }
/* 罪亚斯 */
.rlmain .rlcg[cg="zuiyasi"] .rlcg-n { background-image: url('https://i.ibb.co/Cpm8gqp1/image.png'); }
/* 莫蕾 */
.rlmain .rlcg[cg="molei"] .rlcg-n { background-image: url('https://i.ibb.co/BVWhTfbZ/image.png'); }
.rlmain .rlcg[cg="molei"] .rlcg-h { background-image: url('https://i.ibb.co/Vp5PNSh1/1.png'); }
/* 月使徒 */
.rlmain .rlcg[cg="yueshitu"] .rlcg-n { background-image: url('https://i.ibb.co/ZpjKS7h0/image.png'); }
.rlmain .rlcg[cg="yueshitu"] .rlcg-h { background-image: url('https://i.ibb.co/zHB2hCvx/1.png'); }
/* 豪妹 */
.rlmain .rlcg[cg="haomei"] .rlcg-n { background-image: url('https://i.ibb.co/3568Vmyz/image.png'); }
.rlmain .rlcg[cg="haomei"] .rlcg-h { background-image: url('https://i.ibb.co/SXfTzRdT/1.png'); }
/* 伍德 */
.rlmain .rlcg[cg="wude"] .rlcg-n { background-image: url('https://i.ibb.co/yFnXX4rg/image.png'); }
/* 格林·吉莉安 */
.rlmain .rlcg[cg="gelin"] .rlcg-n { background-image: url('https://i.ibb.co/qMXPwM3R/image.png'); }
.rlmain .rlcg[cg="gelin"] .rlcg-h { background-image: url('https://i.ibb.co/FbVhXjS5/1.png'); }
/* 白龙女 */
.rlmain .rlcg[cg="bailongnv"] .rlcg-n { background-image: url('https://i.ibb.co/7djPp3tk/image.png'); }
.rlmain .rlcg[cg="bailongnv"] .rlcg-h { background-image: url('https://i.ibb.co/s9sY1fd8/1.png'); }
/* 白牛 */
.rlmain .rlcg[cg="bainiu"] .rlcg-n { background-image: url('https://i.ibb.co/d0hLnPfT/image.png'); }
/* 不死老人 */
.rlmain .rlcg[cg="busilaoren"] .rlcg-n { background-image: url('https://i.ibb.co/Q7Pn4RLN/image.png'); }
/* 刀魔 */
.rlmain .rlcg[cg="daomo"] .rlcg-n { background-image: url('https://i.ibb.co/p6qXWQ2x/image.png'); }
/* 圣女座 */
.rlmain .rlcg[cg="shengnvzuo"] .rlcg-n { background-image: url('https://i.ibb.co/HTtM2t5C/image.png'); }
.rlmain .rlcg[cg="shengnvzuo"] .rlcg-h { background-image: url('https://i.ibb.co/PzGGfyj6/1.png'); }
/* 幸运女神 */
.rlmain .rlcg[cg="xingyunnvshen"] .rlcg-n { background-image: url('https://i.ibb.co/DHq5pNZ6/image.png'); }
.rlmain .rlcg[cg="xingyunnvshen"] .rlcg-h { background-image: url('https://i.ibb.co/01f7jnB/1.png'); }
/* 命运女神 */
.rlmain .rlcg[cg="mingyunnvshen"] .rlcg-n { background-image: url('https://i.ibb.co/CphfSgjH/image.png'); }
.rlmain .rlcg[cg="mingyunnvshen"] .rlcg-h { background-image: url('https://i.ibb.co/KjSy1chj/2.png'); }
/* 月女巫·瑟希莉丝 */
.rlmain .rlcg[cg="yuenvwu"] .rlcg-n { background-image: url('https://i.ibb.co/ynvF0w88/image.png'); }
.rlmain .rlcg[cg="yuenvwu"] .rlcg-h { background-image: url('https://i.ibb.co/sdxfPqC7/1.png'); }
/* 法师贤者·瑟菲莉娅 */
.rlmain .rlcg[cg="fashixianzhe"] .rlcg-n { background-image: url('https://i.ibb.co/tMnL93LK/image.png'); }
.rlmain .rlcg[cg="fashixianzhe"] .rlcg-h { background-image: url('https://i.ibb.co/PZFDBkWn/1.png'); }
/* 白金使徒 */
.rlmain .rlcg[cg="baijinshitu"] .rlcg-n { background-image: url('https://i.ibb.co/j9KCxHJj/image.png'); }
/* 灰绅士 */
.rlmain .rlcg[cg="huishenshi"] .rlcg-n { background-image: url('https://i.ibb.co/fdTh3CRh/image.png'); }
/* 老神父 */
.rlmain .rlcg[cg="laoshenfu"] .rlcg-n { background-image: url('https://i.ibb.co/4R4pK510/image.png'); }

/* ---------- 原创DLC新增角色CG映射 ---------- */
/* 罂清雪 */
.rlmain .rlcg[cg="yingqingxue"] .rlcg-n { background-image: url('https://i.ibb.co/pjstXC5h/image.png'); }
.rlmain .rlcg[cg="yingqingxue"] .rlcg-h { background-image: url('https://i.ibb.co/ybfSM9D/1.png'); }
/* 沈墨婉 */
.rlmain .rlcg[cg="shenmowan"] .rlcg-n { background-image: url('https://i.ibb.co/8L6R2mZg/image.png'); }
.rlmain .rlcg[cg="shenmowan"] .rlcg-h { background-image: url('https://i.ibb.co/Z6HQrWxp/1.png'); }
/* 幽白给 */
.rlmain .rlcg[cg="youbaigei"] .rlcg-n { background-image: url('https://i.ibb.co/BpYBKQS/image.png'); }
.rlmain .rlcg[cg="youbaigei"] .rlcg-h { background-image: url('https://i.ibb.co/5XVCKs21/1.png'); }
/* 沈凌云 */
.rlmain .rlcg[cg="shenlingyun"] .rlcg-n { background-image: url('https://i.ibb.co/kVMmzwW7/image.png'); }
.rlmain .rlcg[cg="shenlingyun"] .rlcg-h { background-image: url('https://i.ibb.co/1GF13f6y/1.png'); }
/* 红嫣仙 */
.rlmain .rlcg[cg="hongyanxian"] .rlcg-n { background-image: url('https://i.ibb.co/KRx5wzc/image.png'); }
.rlmain .rlcg[cg="hongyanxian"] .rlcg-h { background-image: url('https://i.ibb.co/VcN84F8f/1.png'); }
/* 李红音 */
.rlmain .rlcg[cg="lihongyin"] .rlcg-n { background-image: url('https://i.ibb.co/cSdSDZh7/image.png'); }
.rlmain .rlcg[cg="lihongyin"] .rlcg-h { background-image: url('https://i.ibb.co/QF26hk3N/1.png'); }
/* 谢瓶儿 */
.rlmain .rlcg[cg="xiepinger"] .rlcg-n { background-image: url('https://i.ibb.co/Y7DB8wBB/image.png'); }
.rlmain .rlcg[cg="xiepinger"] .rlcg-h { background-image: url('https://i.ibb.co/chDRRM6x/1.png'); }
/* 赵紫灵 */
.rlmain .rlcg[cg="zhaoziling"] .rlcg-n { background-image: url('https://i.ibb.co/k22mGDm8/image.png'); }
.rlmain .rlcg[cg="zhaoziling"] .rlcg-h { background-image: url('https://i.ibb.co/HDX5Cpbh/1.png'); }
/* 绛凰 */
.rlmain .rlcg[cg="jianghuang"] .rlcg-n { background-image: url('https://i.ibb.co/1YvvZ46W/image.png'); }
.rlmain .rlcg[cg="jianghuang"] .rlcg-h { background-image: url('https://i.ibb.co/pBz6NmwJ/1.png'); }
/* 云清 */
.rlmain .rlcg[cg="yunqing"] .rlcg-n { background-image: url('https://i.ibb.co/v4wjsBws/image.png'); }
.rlmain .rlcg[cg="yunqing"] .rlcg-h { background-image: url('https://i.ibb.co/5zxPKYm/1.png'); }
/* 苏烬棠 */
.rlmain .rlcg[cg="sujintang"] .rlcg-n { background-image: url('https://i.ibb.co/jPRMWvJk/image.png'); }
.rlmain .rlcg[cg="sujintang"] .rlcg-h { background-image: url('https://i.ibb.co/p6R0YsR6/1.png'); }
/* 介凝语 */
.rlmain .rlcg[cg="jieningyu"] .rlcg-n { background-image: url('https://i.ibb.co/9mVgsHyD/image.png'); }
.rlmain .rlcg[cg="jieningyu"] .rlcg-h { background-image: url('https://i.ibb.co/sTyTpt1/1.png'); }
/* 方清晓 */
.rlmain .rlcg[cg="fangqingxiao"] .rlcg-n { background-image: url('https://i.ibb.co/y2jxhKf/image.png'); }
.rlmain .rlcg[cg="fangqingxiao"] .rlcg-h { background-image: url('https://i.ibb.co/G4yL8NQR/1.png'); }
/* 沧璘 */
.rlmain .rlcg[cg="canglin"] .rlcg-n { background-image: url('https://i.ibb.co/cc2C1M6k/image.png'); }
.rlmain .rlcg[cg="canglin"] .rlcg-h { background-image: url('https://i.ibb.co/BRf6x7W/11.png'); }
/* 何玉汵 */
.rlmain .rlcg[cg="heyubian"] .rlcg-n { background-image: url('https://i.ibb.co/nsNmSvvb/image.png'); }
.rlmain .rlcg[cg="heyubian"] .rlcg-h { background-image: url('https://i.ibb.co/q3dCwC3v/1.png'); }
/* 晏清寒 */
.rlmain .rlcg[cg="yanqinghan"] .rlcg-n { background-image: url('https://i.ibb.co/6J4F1QTW/image.png'); }
.rlmain .rlcg[cg="yanqinghan"] .rlcg-h { background-image: url('https://i.ibb.co/6S5hw5V/1.png'); }
/* 小血 */
.rlmain .rlcg[cg="xiaoxue"] .rlcg-n { background-image: url('https://i.ibb.co/H8326DZ/image.png'); }
.rlmain .rlcg[cg="xiaoxue"] .rlcg-h { background-image: url('https://i.ibb.co/hFdGrb30/1.png'); }
/* 叶知微 */
.rlmain .rlcg[cg="yezhiwei"] .rlcg-n { background-image: url('https://i.ibb.co/R4dBR81K/image.png'); }
.rlmain .rlcg[cg="yezhiwei"] .rlcg-h { background-image: url('https://i.ibb.co/Wv3S67Qf/1.png'); }
/* 翩跹 */
.rlmain .rlcg[cg="pianxian"] .rlcg-n { background-image: url('https://i.ibb.co/rKK2gL4h/image.png'); }
.rlmain .rlcg[cg="pianxian"] .rlcg-h { background-image: url('https://i.ibb.co/DgkZRwJ8/1.png'); }
/* 苏秋湫 */
.rlmain .rlcg[cg="suqiuqiu"] .rlcg-n { background-image: url('https://i.ibb.co/N6X4js5K/image.png'); }
.rlmain .rlcg[cg="suqiuqiu"] .rlcg-h { background-image: url('https://i.ibb.co/C3pdpDZ5/1.png'); }
/* 白璃星 */
.rlmain .rlcg[cg="bailixing"] .rlcg-n { background-image: url('https://i.ibb.co/tp8647NN/image.png'); }
.rlmain .rlcg[cg="bailixing"] .rlcg-h { background-image: url('https://i.ibb.co/bgdMdvhR/1.png'); }
/* 九喵喵 */
.rlmain .rlcg[cg="jiumiaomiao"] .rlcg-n { background-image: url('https://i.ibb.co/SXMXq97j/image.png'); }
.rlmain .rlcg[cg="jiumiaomiao"] .rlcg-h { background-image: url('https://i.ibb.co/cXt1TsbX/1.png'); }
/* 蜜拉 */
.rlmain .rlcg[cg="mila"] .rlcg-n { background-image: url('https://i.ibb.co/fzHT7Dn1/image.png'); }
.rlmain .rlcg[cg="mila"] .rlcg-h { background-image: url('https://i.ibb.co/zVkJPrCL/1.png'); }
/* 维尔娜 */
.rlmain .rlcg[cg="weierena"] .rlcg-n { background-image: url('https://i.ibb.co/CsVXVyCH/image.png'); }
.rlmain .rlcg[cg="weierena"] .rlcg-h { background-image: url('https://i.ibb.co/6hV0XXD/1.png'); }
/* 绯月 */
.rlmain .rlcg[cg="feiyue"] .rlcg-n { background-image: url('https://i.ibb.co/Ld7ypXvc/image.png'); }
.rlmain .rlcg[cg="feiyue"] .rlcg-h { background-image: url('https://i.ibb.co/B2fHq7vR/1.png'); }
/* 赫拉克 */
.rlmain .rlcg[cg="helake"] .rlcg-n { background-image: url('https://i.ibb.co/4ZLw8YBg/image.png'); }
.rlmain .rlcg[cg="helake"] .rlcg-h { background-image: url('https://i.ibb.co/7NbzP5TF/1.png'); }
/* 艾洛蒂 */
.rlmain .rlcg[cg="ailuodi"] .rlcg-n { background-image: url('https://i.ibb.co/Lz1ssgxg/image.png'); }
.rlmain .rlcg[cg="ailuodi"] .rlcg-h { background-image: url('https://i.ibb.co/j9TLV4bx/1.png'); }
/* 芽莉莉 */
.rlmain .rlcg[cg="yalili"] .rlcg-n { background-image: url('https://i.ibb.co/cc2KypCf/image.png'); }
.rlmain .rlcg[cg="yalili"] .rlcg-h { background-image: url('https://i.ibb.co/5XPk4CGX/11.png'); }
/* 瑟菲娅 */
.rlmain .rlcg[cg="sefeiya"] .rlcg-n { background-image: url('https://i.ibb.co/MD4jmSLd/image.png'); }
.rlmain .rlcg[cg="sefeiya"] .rlcg-h { background-image: url('https://i.ibb.co/Xx7Wzmvk/1.png'); }
/* 诺娃 */
.rlmain .rlcg[cg="nuowa"] .rlcg-n { background-image: url('https://i.ibb.co/SFqQq03/image.png'); }
.rlmain .rlcg[cg="nuowa"] .rlcg-h { background-image: url('https://i.ibb.co/v6TzMK47/1.png'); }
/* 薇缇雅 */
.rlmain .rlcg[cg="weitiya"] .rlcg-n { background-image: url('https://i.ibb.co/SzsJNzP/image.png'); }
.rlmain .rlcg[cg="weitiya"] .rlcg-h { background-image: url('https://i.ibb.co/yFYwqVbd/1.png'); }
/* 咬人喵 */
.rlmain .rlcg[cg="yaorenmiao"] .rlcg-n { background-image: url('https://i.ibb.co/5hXnCrJc/image.png'); }
.rlmain .rlcg[cg="yaorenmiao"] .rlcg-h { background-image: url('https://i.ibb.co/XxqkDTWC/1.png'); }
/* 陈胖 */
.rlmain .rlcg[cg="chenpang"] .rlcg-n { background-image: url('https://i.ibb.co/ynt71FRC/image.png'); }
/* 莉莉亚 */
.rlmain .rlcg[cg="liliya"] .rlcg-n { background-image: url('https://i.ibb.co/Fk4qFLLJ/image.png'); }
.rlmain .rlcg[cg="liliya"] .rlcg-h { background-image: url('https://i.ibb.co/R4ZfzQDj/1.png'); }
/* 美食家 */
.rlmain .rlcg[cg="meishijia"] .rlcg-n { background-image: url('https://i.ibb.co/fzXGgTN9/image.png'); }
/* 国足三兄弟 */
.rlmain .rlcg[cg="guozusanxiong"] .rlcg-n { background-image: url('https://i.ibb.co/MDj1mJ4f/image.png'); }
/* Z女士 */
.rlmain .rlcg[cg="z-nvshi"] .rlcg-n { background-image: url('https://i.ibb.co/Zt6qq5V/Z.png'); }
.rlmain .rlcg[cg="z-nvshi"] .rlcg-h { background-image: url('https://i.ibb.co/9H0GZvTy/Z-1.png'); }
/* 光沐 */
.rlmain .rlcg[cg="guangmu"] .rlcg-n { background-image: url('https://i.ibb.co/NgFmrWyM/image.png'); }
.rlmain .rlcg[cg="guangmu"] .rlcg-h { background-image: url('https://i.ibb.co/DgwhF2Hw/1.png'); }
/* 露西西 */
.rlmain .rlcg[cg="luxixi"] .rlcg-n { background-image: url('https://i.ibb.co/HLgkTVsZ/image.png'); }
.rlmain .rlcg[cg="luxixi"] .rlcg-h { background-image: url('https://i.ibb.co/LhbwF1zR/1.png'); }
/* 萨曼娅 */
.rlmain .rlcg[cg="samanya"] .rlcg-n { background-image: url('https://i.ibb.co/mC2d85K8/image.png'); }
.rlmain .rlcg[cg="samanya"] .rlcg-h { background-image: url('https://i.ibb.co/YTkkJkZ0/1.png'); }
/* 丝洛儿 */
.rlmain .rlcg[cg="siluoer"] .rlcg-n { background-image: url('https://i.ibb.co/nq78Y2Hm/image.png'); }
.rlmain .rlcg[cg="siluoer"] .rlcg-h { background-image: url('https://i.ibb.co/mFvFvnJp/1.png'); }
/* ---------- 绝区零角色CG映射 ---------- */
/* 哲 */
.rlmain .rlcg[cg="zhe"] .rlcg-n { background-image: url('https://i.ibb.co/Dgvb6cgh/image.png'); }
/* 铃 */
.rlmain .rlcg[cg="ling"] .rlcg-n { background-image: url('https://i.ibb.co/YB06z0Xd/image.png'); }
.rlmain .rlcg[cg="ling"] .rlcg-h { background-image: url('https://i.ibb.co/7NLKStV8/1.png'); }
/* 11号 */
.rlmain .rlcg[cg="11hao"] .rlcg-n { background-image: url('https://i.ibb.co/gLDzhkZ3/11.png'); }
.rlmain .rlcg[cg="11hao"] .rlcg-h { background-image: url('https://i.ibb.co/HT3Yx1BL/11-1.png'); }
/* 珂蕾妲 */
.rlmain .rlcg[cg="keleida"] .rlcg-n { background-image: url('https://i.ibb.co/JwSCmhW0/image.png'); }
.rlmain .rlcg[cg="keleida"] .rlcg-h { background-image: url('https://i.ibb.co/ksZNZKft/1.png'); }
/* 格莉丝 */
.rlmain .rlcg[cg="gelisi"] .rlcg-n { background-image: url('https://i.ibb.co/wN3kNqHt/image.png'); }
.rlmain .rlcg[cg="gelisi"] .rlcg-h { background-image: url('https://i.ibb.co/6RCwFncw/1.png'); }
/* 安比 */
.rlmain .rlcg[cg="anbi"] .rlcg-n { background-image: url('https://i.ibb.co/0jqjvBsF/image.png'); }
.rlmain .rlcg[cg="anbi"] .rlcg-h { background-image: url('https://i.ibb.co/FbbB7BVj/1.png'); }
/* 猫又 */
.rlmain .rlcg[cg="maoyou"] .rlcg-n { background-image: url('https://i.ibb.co/14xg9RT/image.png'); }
.rlmain .rlcg[cg="maoyou"] .rlcg-h { background-image: url('https://i.ibb.co/Mk6zpcXN/1.png'); }
/* 妮可 */
.rlmain .rlcg[cg="nike"] .rlcg-n { background-image: url('https://i.ibb.co/Xfwy0W0g/image.png'); }
.rlmain .rlcg[cg="nike"] .rlcg-h { background-image: url('https://i.ibb.co/9kt00cs5/1.png'); }
/* 比利 */
.rlmain .rlcg[cg="bili"] .rlcg-n { background-image: url('https://i.ibb.co/N6zwNsXF/image.png'); }
/* 凯撒 */
.rlmain .rlcg[cg="kaisa"] .rlcg-n { background-image: url('https://i.ibb.co/tPkksTjp/image.png'); }
.rlmain .rlcg[cg="kaisa"] .rlcg-h { background-image: url('https://i.ibb.co/fYVKZ95d/1.png'); }
/* 柏妮思 */
.rlmain .rlcg[cg="bonisi"] .rlcg-n { background-image: url('https://i.ibb.co/bwjLBXD/image.png'); }
.rlmain .rlcg[cg="bonisi"] .rlcg-h { background-image: url('https://i.ibb.co/B2tz4wvm/1.png'); }
/* 露西 */
.rlmain .rlcg[cg="luxi"] .rlcg-n { background-image: url('https://i.ibb.co/27c6rKd4/image.png'); }
.rlmain .rlcg[cg="luxi"] .rlcg-h { background-image: url('https://i.ibb.co/hJMDvsMq/1.png'); }
/* 朱鸢 */
.rlmain .rlcg[cg="zhuyuan"] .rlcg-n { background-image: url('https://i.ibb.co/DP7VhtZ3/image.png'); }
.rlmain .rlcg[cg="zhuyuan"] .rlcg-h { background-image: url('https://i.ibb.co/BH7hwzBG/1.png'); }
/* 青衣 */
.rlmain .rlcg[cg="qingyi"] .rlcg-n { background-image: url('https://i.ibb.co/Ng1HsM4f/image.png'); }
.rlmain .rlcg[cg="qingyi"] .rlcg-h { background-image: url('https://i.ibb.co/5hMrJ6S0/1.png'); }
/* 简·杜 */
.rlmain .rlcg[cg="jiandu"] .rlcg-n { background-image: url('https://i.ibb.co/35FWY0K1/image.png'); }
.rlmain .rlcg[cg="jiandu"] .rlcg-h { background-image: url('https://i.ibb.co/39WK6FnR/1.png'); }
/* 赛斯 */
.rlmain .rlcg[cg="saisi"] .rlcg-n { background-image: url('https://i.ibb.co/3mQbTJty/image.png'); }
/* 薇薇安 */
.rlmain .rlcg[cg="weiweian"] .rlcg-n { background-image: url('https://i.ibb.co/ymtpyt9s/image.png'); }
.rlmain .rlcg[cg="weiweian"] .rlcg-h { background-image: url('https://i.ibb.co/V04jkqgx/1.png'); }
/* 星见雅 */
.rlmain .rlcg[cg="xingjianya"] .rlcg-n { background-image: url('https://i.ibb.co/TxbK4cp7/image.png'); }
.rlmain .rlcg[cg="xingjianya"] .rlcg-h { background-image: url('https://i.ibb.co/jkrr9XJF/1.png'); }
/* 月城柳 */
.rlmain .rlcg[cg="yuechengliu"] .rlcg-n { background-image: url('https://i.ibb.co/LDynCYns/image.png'); }
.rlmain .rlcg[cg="yuechengliu"] .rlcg-h { background-image: url('https://i.ibb.co/TBN9DsCb/1.png'); }
/* 苍角 */
.rlmain .rlcg[cg="cangjiao"] .rlcg-n { background-image: url('https://i.ibb.co/b5sKqhyT/image.png'); }
.rlmain .rlcg[cg="cangjiao"] .rlcg-h { background-image: url('https://i.ibb.co/RG8Lb24s/1.png'); }
/* 莱卡恩 */
.rlmain .rlcg[cg="laikaen"] .rlcg-n { background-image: url('https://i.ibb.co/JWDJPkRr/image.png'); }
/* 丽娜 */
.rlmain .rlcg[cg="lina"] .rlcg-n { background-image: url('https://i.ibb.co/wfxFb1v/image.png'); }
.rlmain .rlcg[cg="lina"] .rlcg-h { background-image: url('https://i.ibb.co/fGVJ8zDG/1.png'); }
/* 艾莲 */
.rlmain .rlcg[cg="ailian"] .rlcg-n { background-image: url('https://i.ibb.co/xngtz1d/image.png'); }
.rlmain .rlcg[cg="ailian"] .rlcg-h { background-image: url('https://i.ibb.co/4nsmZ9nd/1.png'); }
/* 可琳 */
.rlmain .rlcg[cg="kelin"] .rlcg-n { background-image: url('https://i.ibb.co/27CFstXH/image.png'); }
.rlmain .rlcg[cg="kelin"] .rlcg-h { background-image: url('https://i.ibb.co/0yd3Rf0g/1.png'); }
/* ---------- 尼尔组 ---------- */
/* 2B */
.rlmain .rlcg[cg="2b"] .rlcg-n { background-image: url('https://i.ibb.co/sd9Z6R8f/2B.png'); }
.rlmain .rlcg[cg="2b"] .rlcg-h { background-image: url('https://i.ibb.co/PvDfsJnD/2B1.png'); }
/* A2 */
.rlmain .rlcg[cg="a2"] .rlcg-n { background-image: url('https://i.ibb.co/Z6tVDYtY/A2.png'); }
.rlmain .rlcg[cg="a2"] .rlcg-h { background-image: url('https://i.ibb.co/1fgVcmrJ/A21.png'); }
/* 凯妮 */
.rlmain .rlcg[cg="kaini"] .rlcg-n { background-image: url('https://i.ibb.co/Xrmt5dTN/Kaine.png'); }
.rlmain .rlcg[cg="kaini"] .rlcg-h { background-image: url('https://i.ibb.co/FbkH8937/Kaine1.png'); }
/* ---------- 型月组 ---------- */
/* 阿尔托莉雅 */
.rlmain .rlcg[cg="aertuoliya"] .rlcg-n { background-image: url('https://i.ibb.co/35GzhxXK/image.png'); }
.rlmain .rlcg[cg="aertuoliya"] .rlcg-h { background-image: url('https://i.ibb.co/4ZMQ581J/1.png'); }
/* 爱丽丝菲尔 */
.rlmain .rlcg[cg="ailisifeier"] .rlcg-n { background-image: url('https://i.ibb.co/3DSNjy3/image.png'); }
.rlmain .rlcg[cg="ailisifeier"] .rlcg-h { background-image: url('https://i.ibb.co/N2S1Gw4H/1.png'); }
/* 间桐樱 */
.rlmain .rlcg[cg="jiantongying"] .rlcg-n { background-image: url('https://i.ibb.co/DH0pcBxF/image.png'); }
.rlmain .rlcg[cg="jiantongying"] .rlcg-h { background-image: url('https://i.ibb.co/bM5xRJ51/1.png'); }
/* 美杜莎 */
.rlmain .rlcg[cg="meidusha"] .rlcg-n { background-image: url('https://i.ibb.co/WvcN9tWK/image.png'); }
.rlmain .rlcg[cg="meidusha"] .rlcg-h { background-image: url('https://i.ibb.co/W46R3VsZ/1.png'); }
/* 牛若丸 */
.rlmain .rlcg[cg="niuruowan"] .rlcg-n { background-image: url('https://i.ibb.co/qMCzWGZ7/image.png'); }
.rlmain .rlcg[cg="niuruowan"] .rlcg-h { background-image: url('https://i.ibb.co/pjpRzFFn/1.png'); }
/* 杀生院祈荒 */
.rlmain .rlcg[cg="shashengyuan"] .rlcg-n { background-image: url('https://i.ibb.co/6R3swF1T/image.png'); }
.rlmain .rlcg[cg="shashengyuan"] .rlcg-h { background-image: url('https://i.ibb.co/FkHCmCDf/1.png'); }
/* 斯卡蒂 */
.rlmain .rlcg[cg="sikadi"] .rlcg-n { background-image: url('https://i.ibb.co/j9TqMsvw/image.png'); }
.rlmain .rlcg[cg="sikadi"] .rlcg-h { background-image: url('https://i.ibb.co/N6vxMdPM/1.png'); }
/* 提亚马特 */
.rlmain .rlcg[cg="tiyamate"] .rlcg-n { background-image: url('https://i.ibb.co/jvWjQ4dV/image.png'); }
.rlmain .rlcg[cg="tiyamate"] .rlcg-h { background-image: url('https://i.ibb.co/S4kcLPr1/1.png'); }
/* 武则天 */
.rlmain .rlcg[cg="wuzetian"] .rlcg-n { background-image: url('https://i.ibb.co/39WvZTLK/image.png'); }
.rlmain .rlcg[cg="wuzetian"] .rlcg-h { background-image: url('https://i.ibb.co/b5kxzzDR/1.png'); }
/* 玉藻前 */
.rlmain .rlcg[cg="yuzaoqian"] .rlcg-n { background-image: url('https://i.ibb.co/Y4Y0mMqQ/image.png'); }
.rlmain .rlcg[cg="yuzaoqian"] .rlcg-h { background-image: url('https://i.ibb.co/qYJLDJSb/1.png'); }
/* 源赖光 */
.rlmain .rlcg[cg="yuanlaiguang"] .rlcg-n { background-image: url('https://i.ibb.co/JWdTB9Vt/image.png'); }
.rlmain .rlcg[cg="yuanlaiguang"] .rlcg-h { background-image: url('https://i.ibb.co/0Rhty7Bw/1.png'); }
/* 远坂凛 */
.rlmain .rlcg[cg="yuanbanlin"] .rlcg-n { background-image: url('https://i.ibb.co/fYDYkKpY/image.png'); }
.rlmain .rlcg[cg="yuanbanlin"] .rlcg-h { background-image: url('https://i.ibb.co/R4vnz7cJ/1.png'); }
/* 紫式部 */
.rlmain .rlcg[cg="zishibu"] .rlcg-n { background-image: url('https://i.ibb.co/twCXFPmn/image.png'); }
.rlmain .rlcg[cg="zishibu"] .rlcg-h { background-image: url('https://i.ibb.co/1GvBSmnJ/1.png'); }
/* ---------- 原神组 ---------- */
/* 甘雨 */
.rlmain .rlcg[cg="ganyu"] .rlcg-n { background-image: url('https://i.ibb.co/Ps9tz5J8/image.png'); }
.rlmain .rlcg[cg="ganyu"] .rlcg-h { background-image: url('https://i.ibb.co/C5NS6QPn/1.png'); }
/* 刻晴 */
.rlmain .rlcg[cg="keqing"] .rlcg-n { background-image: url('https://i.ibb.co/CKdnh5dZ/image.png'); }
.rlmain .rlcg[cg="keqing"] .rlcg-h { background-image: url('https://i.ibb.co/HfNmTfXK/1.png'); }
/* 雷电影 */
.rlmain .rlcg[cg="leidianying"] .rlcg-n { background-image: url('https://i.ibb.co/bgq3RB82/image.png'); }
.rlmain .rlcg[cg="leidianying"] .rlcg-h { background-image: url('https://i.ibb.co/v0rJn9t/1.png'); }
/* 丽莎 */
.rlmain .rlcg[cg="lisha"] .rlcg-n { background-image: url('https://i.ibb.co/d4KVQMjd/image.png'); }
.rlmain .rlcg[cg="lisha"] .rlcg-h { background-image: url('https://i.ibb.co/nMV4CV23/1.png'); }
/* 琳妮特 */
.rlmain .rlcg[cg="linnite"] .rlcg-n { background-image: url('https://i.ibb.co/Kpcxxm4y/image.png'); }
.rlmain .rlcg[cg="linnite"] .rlcg-h { background-image: url('https://i.ibb.co/FLpfxGTv/1.png'); }
/* 女士（罗莎琳） */
.rlmain .rlcg[cg="luoshalin"] .rlcg-n { background-image: url('https://i.ibb.co/Y7K5J3QP/image.png'); }
.rlmain .rlcg[cg="luoshalin"] .rlcg-h { background-image: url('https://i.ibb.co/gFcfjscz/1.png'); }
/* 玛薇卡 */
.rlmain .rlcg[cg="maweika"] .rlcg-n { background-image: url('https://i.ibb.co/hFMqj3pv/image.png'); }
.rlmain .rlcg[cg="maweika"] .rlcg-h { background-image: url('https://i.ibb.co/s9FMdSD8/1.png'); }
/* 莫娜 */
.rlmain .rlcg[cg="mona"] .rlcg-n { background-image: url('https://i.ibb.co/S7fqftzs/image.png'); }
.rlmain .rlcg[cg="mona"] .rlcg-h { background-image: url('https://i.ibb.co/5hBCcYDS/1.png'); }
/* 凝光 */
.rlmain .rlcg[cg="ningguang"] .rlcg-n { background-image: url('https://i.ibb.co/5W16h9Xk/image.png'); }
.rlmain .rlcg[cg="ningguang"] .rlcg-h { background-image: url('https://i.ibb.co/qYpZQNCG/1.png'); }
/* 琴 */
.rlmain .rlcg[cg="qin"] .rlcg-n { background-image: url('https://i.ibb.co/1fr68XQ5/image.png'); }
.rlmain .rlcg[cg="qin"] .rlcg-h { background-image: url('https://i.ibb.co/FL88ZWJv/1.png'); }
/* 申鹤 */
.rlmain .rlcg[cg="shenhe"] .rlcg-n { background-image: url('https://i.ibb.co/5xTqKDzm/image.png'); }
.rlmain .rlcg[cg="shenhe"] .rlcg-h { background-image: url('https://i.ibb.co/nqgLnjgN/1.png'); }
/* 闲云 */
.rlmain .rlcg[cg="xianyun"] .rlcg-n { background-image: url('https://i.ibb.co/8n649ZqB/image.png'); }
.rlmain .rlcg[cg="xianyun"] .rlcg-h { background-image: url('https://i.ibb.co/xqy2Fq5r/1.png'); }
/* 优菈 */
.rlmain .rlcg[cg="youla"] .rlcg-n { background-image: url('https://i.ibb.co/WW1tQXbX/image.png'); }
.rlmain .rlcg[cg="youla"] .rlcg-h { background-image: url('https://i.ibb.co/RTxgjCXm/1.png'); }
/* ---------- 最终幻想组 ---------- */
/* 爱丽丝·盖恩斯巴勒 */
.rlmain .rlcg[cg="ailisiFF"] .rlcg-n { background-image: url('https://i.ibb.co/Cs71vRc0/image.png'); }
.rlmain .rlcg[cg="ailisiFF"] .rlcg-h { background-image: url('https://i.ibb.co/4wdNJxKT/1.png'); }
/* 蒂法 */
.rlmain .rlcg[cg="difa"] .rlcg-n { background-image: url('https://i.ibb.co/1f2zyHzf/image.png'); }
.rlmain .rlcg[cg="difa"] .rlcg-h { background-image: url('https://i.ibb.co/CKWK4PRD/1.png'); }


/* ============================================================
   21. 短标签别名层 · TOKEN SAVER ALIASES
   将AI输出的极简标签映射到原有样式
   追加至内置CSS最末尾
   ============================================================ */

/* ---------- 21-1 <t> = .rlrow ---------- */
.rlmain t {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 5px 8px;
  margin: 0 0 3px;
  font-size: 12.5px;
  background: linear-gradient(90deg, rgba(28, 36, 64, .5), rgba(28, 36, 64, 0));
  border-left: 2px solid var(--rl-line2);
  transition: background .18s ease-out, border-color .18s ease-out, padding-left .18s ease-out;
}

.rlmain t:hover {
  background: linear-gradient(90deg, rgba(77, 208, 255, .13), rgba(28, 36, 64, 0));
  border-left-color: var(--rl-order);
  padding-left: 12px;
}

.rlmain t > b {
  flex: 0 0 auto;
  min-width: 62px;
  font-size: 11px;
  font-weight: 600;
  color: var(--rl-txt2);
  letter-spacing: .8px;
}

.rlmain t > span {
  flex: 1 1 auto;
  color: var(--rl-txt);
}

/* hover时t层级提升 */
.rlmain t:has([c]:hover) {
  z-index: 9000;
}

/* ---------- 21-2 <g2> = .rlgrid2 ---------- */
.rlmain g2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 9px;
  margin: 0 0 9px;
}

.rlmain g2:has([c]:hover) {
  position: relative;
  z-index: 9000;
}

/* ---------- 21-3 <g3> = .rlgrid3 ---------- */
.rlmain g3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px 8px;
  margin: 0 0 9px;
}

.rlmain g3:has([c]:hover) {
  position: relative;
  z-index: 9000;
}

/* ---------- 21-4 <cd> = .rlcard ---------- */
.rlmain cd {
    display: block;     
  position: relative;
  box-sizing: border-box;
  padding: 11px 13px;
  margin: 0 0 9px;
  background: linear-gradient(150deg, rgba(28, 36, 64, .85), rgba(14, 18, 32, .92));
  border: 1px solid var(--rl-line2);
  clip-path: polygon(var(--rl-cut) 0, 100% 0, 100% calc(100% - var(--rl-cut)), calc(100% - var(--rl-cut)) 100%, 0 100%, 0 var(--rl-cut));
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .5));
  transition: border-color .2s ease-out, filter .25s ease-out, transform .25s var(--rl-ez-panel);
}

.rlmain cd:hover {
  border-color: var(--rl-order-d);
  filter: drop-shadow(0 0 10px rgba(77, 208, 255, .35)) drop-shadow(0 3px 8px rgba(0, 0, 0, .55));
  transform: translateY(-2px);
}

.rlmain cd:has([c]:hover) {
  position: relative;
  z-index: 100;
  clip-path: none;
}

.rlmain cd::before {
  content: '';
  position: absolute;
  top: 6px;
  right: 8px;
  width: 16px;
  height: 8px;
  background:
    linear-gradient(90deg, var(--rl-order) 0 4px, transparent 4px 6px, var(--rl-order) 6px 10px, transparent 10px 12px, var(--rl-chaos) 12px 16px);
  opacity: .55;
}

.rlmain cd::after {
  content: '';
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 2px;
  background: linear-gradient(180deg, var(--rl-order), transparent);
  opacity: 0;
  transition: opacity .25s ease-out;
}

.rlmain cd:hover::after {
  opacity: 1;
}

/* cd内hover时解除clip-path */
.rlmain cd:has([c]:hover) {
  z-index: 202;
  filter: none;
  clip-path: none;
}

.rlmain cd:has([c]:hover):hover {
  filter: none;
}

/* ---------- 21-5 <d> = .rldiv ---------- */
.rlmain d {
  display: block;
  height: 9px;
  margin: 10px 0;
  border: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='9' viewBox='0 0 120 9'%3E%3Cpath d='M0 4.5h44M76 4.5h44' stroke='%23223052' stroke-width='1'/%3E%3Cpath d='M60 .8l5.4 3.7L60 8.2l-5.4-3.7Z' fill='none' stroke='%234dd0ff' stroke-width='1'/%3E%3Cpath d='M50 4.5h2.4M67.6 4.5H70' stroke='%23ffc94d' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 9px;
  opacity: .8;
}

/* ---------- 21-6 <n> = .rlnum ---------- */
.rlmain n {
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 13px;
  font-weight: 700;
  color: var(--rl-order);
  text-shadow: 0 0 7px rgba(77, 208, 255, .5);
}

/* ---------- 21-7 [c] = .rlcap (属性选择器) ---------- */
.rlmain [c] {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  max-width: 100%;
  padding: 2px 8px;
  margin: 2px 3px 2px 0;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .6px;
  color: var(--rl-txt2);
  white-space: nowrap;
  text-overflow: ellipsis;
  background: rgba(28, 36, 64, .8);
  border: 1px solid var(--rl-line2);
  border-radius: 2px;
  cursor: default;
  transition: color .18s ease-out, border-color .18s ease-out, box-shadow .18s ease-out, transform .18s var(--rl-ez-pop);
  -webkit-tap-highlight-color: transparent;
}

.rlmain [c] > i {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 99999;
  box-sizing: border-box;
  width: 320px;
  max-width: min(320px, calc(100cqw - 30px));
  margin-top: 6px;
  padding: 9px 11px;
  font: 400 10.5px/1.55 inherit;
  font-style: normal;
  color: var(--rl-txt);
  text-align: left;
  white-space: normal;
  letter-spacing: .2px;
  background: linear-gradient(160deg, rgba(12, 16, 28, .98), rgba(5, 7, 12, .99));
  border: 1px solid var(--rl-order-d);
  border-radius: 2px;
  box-shadow: 0 6px 22px rgba(0, 0, 0, .8), 0 0 0 1px rgba(77, 208, 255, .2), inset 0 1px 0 rgba(120, 180, 240, .12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px) scale(.96);
  pointer-events: none;
  transition: opacity .22s ease-out, transform .22s var(--rl-ez-pop), visibility .22s;
  max-height: none;
  overflow: visible;
}

.rlmain [c] > i::before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 14px;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-bottom-color: var(--rl-order-d);
}

.rlmain [c] > i::after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 15px;
  width: 0;
  height: 0;
  border: 4px solid transparent;
  border-bottom-color: rgba(12, 16, 28, .98);
}

.rlmain [c]:hover {
  z-index: 9999;
  color: var(--rl-order);
  border-color: var(--rl-order-d);
  box-shadow: 0 0 10px rgba(77, 208, 255, .45), 0 0 20px rgba(77, 208, 255, .18);
  transform: translateY(-1px);
}

.rlmain [c]:hover > i {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.rlmain [c] > i > b {
  display: block;
  margin-bottom: 3px;
  font-size: 11px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: .6px;
  text-shadow: 0 0 6px rgba(77, 208, 255, .5);
}

.rlmain [c] > i > hr {
  height: 1px;
  margin: 4px 0;
  border: 0;
  background: linear-gradient(90deg, var(--rl-order-d), transparent);
}

/* [c][n] = .rlcap.rlcap-num */
.rlmain [c][n],
.rlmain [c][n]:hover {
  padding: 0;
  margin: 0;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
}

.rlmain [c][n] > i {
  left: -4px;
}

/* ---------- 21-8 阵营色继承（[c]版） ---------- */
.rlmain [c][fc="order"] {
  color: var(--rl-order);
  border-color: rgba(77, 208, 255, .5);
  background: rgba(77, 208, 255, .1);
  text-shadow: 0 0 6px rgba(77, 208, 255, .45);
}

.rlmain [c][fc="chaos"] {
  color: var(--rl-chaos);
  border-color: rgba(255, 45, 85, .5);
  background: rgba(255, 45, 85, .1);
  text-shadow: 0 0 6px rgba(255, 45, 85, .5);
}

.rlmain [c][fc="nature"] {
  color: var(--rl-nature);
  border-color: rgba(61, 220, 151, .5);
  background: rgba(61, 220, 151, .1);
  text-shadow: 0 0 6px rgba(61, 220, 151, .45);
}

.rlmain [c][fc="none"] {
  color: var(--rl-txt2);
  border-color: var(--rl-line2);
  background: rgba(28, 36, 64, .6);
}

/* ---------- 21-9 品质色继承（[c]版） ---------- */
.rlmain [c][q="1"] { color: #9aa8bd; border-color: rgba(154, 168, 189, .4); }
.rlmain [c][q="2"] { color: #5fd97a; border-color: rgba(95, 217, 122, .45); box-shadow: 0 0 4px rgba(95, 217, 122, .35); }
.rlmain [c][q="3"] { color: #4da6ff; border-color: rgba(77, 166, 255, .5); box-shadow: 0 0 4px rgba(77, 166, 255, .35); }
.rlmain [c][q="4"] { color: #b968ff; border-color: rgba(185, 104, 255, .5); box-shadow: 0 0 10px rgba(185, 104, 255, .45), 0 0 20px rgba(185, 104, 255, .18); }
.rlmain [c][q="5"] { color: var(--rl-gold); border-color: rgba(255, 201, 77, .55); box-shadow: 0 0 10px rgba(255, 201, 77, .45), 0 0 20px rgba(255, 201, 77, .18); }
.rlmain [c][q="6"] {
  color: #d8952a;
  border-color: rgba(216, 149, 42, .6);
  background: linear-gradient(90deg, rgba(216, 149, 42, .16), rgba(90, 55, 10, .08));
  box-shadow: 0 0 8px rgba(216, 149, 42, .6), 0 0 24px rgba(216, 149, 42, .3), 0 0 48px rgba(216, 149, 42, .12);
}
.rlmain [c][q="7"] {
  color: #ff5ce0;
  border-color: rgba(255, 92, 224, .65);
  background: linear-gradient(90deg, rgba(255, 92, 224, .18), rgba(77, 208, 255, .1));
  box-shadow: 0 0 8px rgba(255, 92, 224, .6), 0 0 24px rgba(255, 92, 224, .3), 0 0 48px rgba(255, 92, 224, .12);
  animation: rlEternal 3.4s ease-in-out infinite;
}

/* ---------- 21-10 <w> = .rlwx ---------- */
.rlmain w {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rl-txt);
}

.rlmain w::before {
  content: '';
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 18px 18px;
  mask-size: 18px 18px;
}

.rlmain w::after {
  content: attr(t);
  white-space: nowrap;
}

.rlmain w[w="sun"]::before {
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 6px rgba(255, 201, 77, .75));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='4.6' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M12 1.8v3.1M12 19.1v3.1M1.8 12h3.1M19.1 12h3.1M4.8 4.8l2.2 2.2M17 17l2.2 2.2M19.2 4.8L17 7M7 17l-2.2 2.2' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='4.6' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M12 1.8v3.1M12 19.1v3.1M1.8 12h3.1M19.1 12h3.1M4.8 4.8l2.2 2.2M17 17l2.2 2.2M19.2 4.8L17 7M7 17l-2.2 2.2' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  animation: rlSpin 22s linear infinite;
}

.rlmain w[w="night"]::before {
  background-color: #a8c0e8;
  filter: drop-shadow(0 0 6px rgba(168, 192, 232, .7));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.4 14.6A8.6 8.6 0 0 1 9.4 3.6a8.8 8.8 0 1 0 11 11Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3Ccircle cx='16.8' cy='6.4' r='.9' fill='black'/%3E%3Ccircle cx='19.6' cy='9.6' r='.6' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.4 14.6A8.6 8.6 0 0 1 9.4 3.6a8.8 8.8 0 1 0 11 11Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3Ccircle cx='16.8' cy='6.4' r='.9' fill='black'/%3E%3Ccircle cx='19.6' cy='9.6' r='.6' fill='black'/%3E%3C/svg%3E");
  animation: rlBreath 4.2s ease-in-out infinite;
}

.rlmain w[w="rain"]::before {
  background-color: #5fb4e8;
  filter: drop-shadow(0 0 5px rgba(95, 180, 232, .7));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 15.4a4.2 4.2 0 0 1 .5-8.4 5.6 5.6 0 0 1 10.7 1.3 3.6 3.6 0 0 1-.8 7.1Z' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M8.4 18.2l-1 2.6M12 18.2l-1 2.6M15.6 18.2l-1 2.6' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 15.4a4.2 4.2 0 0 1 .5-8.4 5.6 5.6 0 0 1 10.7 1.3 3.6 3.6 0 0 1-.8 7.1Z' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M8.4 18.2l-1 2.6M12 18.2l-1 2.6M15.6 18.2l-1 2.6' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  animation: rlRainShift 1.5s steps(3) infinite;
}

.rlmain w[w="storm"]::before {
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 8px rgba(255, 201, 77, .9));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 14.6a4.2 4.2 0 0 1 .5-8.4 5.6 5.6 0 0 1 10.7 1.3 3.6 3.6 0 0 1-.8 7.1' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M13.2 12.4l-3.6 5.2h2.8l-1.4 4.2 4.4-6h-3Z' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 14.6a4.2 4.2 0 0 1 .5-8.4 5.6 5.6 0 0 1 10.7 1.3 3.6 3.6 0 0 1-.8 7.1' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M13.2 12.4l-3.6 5.2h2.8l-1.4 4.2 4.4-6h-3Z' fill='black'/%3E%3C/svg%3E");
  animation: rlFlash 3.1s steps(1) infinite;
}

.rlmain w[w="snow"]::before {
  background-color: #d8ecff;
  filter: drop-shadow(0 0 6px rgba(216, 236, 255, .8));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4v19.2M3.7 7.2l16.6 9.6M20.3 7.2L3.7 16.8' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M12 6.2l-2 2 2 2 2-2ZM12 15.6l-2 2 2 2 2-2Z' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4v19.2M3.7 7.2l16.6 9.6M20.3 7.2L3.7 16.8' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M12 6.2l-2 2 2 2 2-2ZM12 15.6l-2 2 2 2 2-2Z' fill='black'/%3E%3C/svg%3E");
  animation: rlSpin 9s linear infinite;
}

.rlmain w[w="fog"]::before {
  background-color: #90a4c4;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 8.4h14M6.6 12h14.4M3 15.6h11.4M17.4 15.6H21M3 19.2h9' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 8.4h14M6.6 12h14.4M3 15.6h11.4M17.4 15.6H21M3 19.2h9' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
  animation: rlFogDrift 4.6s ease-in-out infinite;
}

.rlmain w[w="cloud"]::before {
  background-color: #8fa8c8;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 18.6a4.4 4.4 0 0 1 .5-8.8 5.8 5.8 0 0 1 11.1 1.4 3.8 3.8 0 0 1-.8 7.4Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 18.6a4.4 4.4 0 0 1 .5-8.8 5.8 5.8 0 0 1 11.1 1.4 3.8 3.8 0 0 1-.8 7.4Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E");
  animation: rlFogDrift 6.8s ease-in-out infinite;
}

.rlmain w[w="wind"]::before {
  background-color: var(--rl-nature);
  filter: drop-shadow(0 0 5px rgba(61, 220, 151, .6));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9.6h11.4a2.7 2.7 0 1 0-2.7-2.7M3 14.4h15a2.7 2.7 0 1 1-2.7 2.7M3 12h6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9.6h11.4a2.7 2.7 0 1 0-2.7-2.7M3 14.4h15a2.7 2.7 0 1 1-2.7 2.7M3 12h6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  animation: rlWindPush 2.4s ease-in-out infinite;
}

.rlmain w[w="void"]::before {
  background-color: var(--rl-chaos);
  filter: drop-shadow(0 0 8px rgba(255, 45, 85, .8));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='3.4' fill='black'/%3E%3Cpath d='M12 3.6v2.4M12 18v2.4M3.6 12h2.4M18 12h2.4' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='3.4' fill='black'/%3E%3Cpath d='M12 3.6v2.4M12 18v2.4M3.6 12h2.4M18 12h2.4' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
  animation: rlVoidPulse 2.6s ease-in-out infinite;
}

/* ---------- 21-11 <dg> = .rldg ---------- */
.rlmain dg {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px 7px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  border: 1px solid;
  border-radius: 2px;
}

.rlmain dg::before {
  content: '';
  width: 12px;
  height: 12px;
  margin-right: 3px;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4 22 20.4H2Z' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M12 8.4v5.4M12 16.4v1.4' stroke='black' stroke-width='2.1' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4 22 20.4H2Z' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M12 8.4v5.4M12 16.4v1.4' stroke='black' stroke-width='2.1' stroke-linecap='round'/%3E%3C/svg%3E");
  -webkit-mask-size: 12px 12px;
  mask-size: 12px 12px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-color: currentColor;
}

.rlmain dg[dg="1"] { color: var(--rl-nature); border-color: rgba(61, 220, 151, .45); background: rgba(61, 220, 151, .09); }
.rlmain dg[dg="1"]::after { content: '★'; }
.rlmain dg[dg="2"] { color: #9ddc3d; border-color: rgba(157, 220, 61, .45); background: rgba(157, 220, 61, .09); }
.rlmain dg[dg="2"]::after { content: '★★'; }
.rlmain dg[dg="3"] { color: var(--rl-gold); border-color: rgba(255, 201, 77, .5); background: rgba(255, 201, 77, .1); box-shadow: 0 0 4px rgba(255, 201, 77, .35); }
.rlmain dg[dg="3"]::after { content: '★★★'; }
.rlmain dg[dg="4"] { color: #ff8a3d; border-color: rgba(255, 138, 61, .55); background: rgba(255, 138, 61, .12); box-shadow: 0 0 10px rgba(255, 138, 61, .45), 0 0 20px rgba(255, 138, 61, .18); }
.rlmain dg[dg="4"]::after { content: '★★★★'; }
.rlmain dg[dg="5"] { color: var(--rl-chaos); border-color: rgba(255, 45, 85, .6); background: rgba(255, 45, 85, .14); box-shadow: 0 0 8px rgba(255, 45, 85, .6), 0 0 24px rgba(255, 45, 85, .3), 0 0 48px rgba(255, 45, 85, .12); animation: rlBreath 1.3s ease-in-out infinite; }
.rlmain dg[dg="5"]::after { content: '★★★★★'; }
.rlmain dg[dg="6"] { color: var(--rl-gold-d); border-color: rgba(201, 162, 39, .65); background: rgba(201, 162, 39, .16); box-shadow: 0 0 10px rgba(201, 162, 39, .7), 0 0 28px rgba(201, 162, 39, .4), 0 0 56px rgba(201, 162, 39, .18); animation: rlBreath 0.8s ease-in-out infinite; }
.rlmain dg[dg="6"]::after { content: '★★★★★★'; }

/* ---------- 21-12 <tg> = .rltag ---------- */
.rlmain tg {
  display: inline-block;
  padding: 2px 8px;
  margin: 2px 3px 2px 0;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .6px;
  color: var(--rl-txt2);
  background: rgba(28, 36, 64, .8);
  border: 1px solid var(--rl-line2);
  border-radius: 2px;
  transition: color .18s ease-out, border-color .18s ease-out, box-shadow .18s ease-out, transform .18s var(--rl-ez-pop);
}

.rlmain tg:hover {
  color: var(--rl-order);
  border-color: var(--rl-order-d);
  box-shadow: 0 0 10px rgba(77, 208, 255, .45), 0 0 20px rgba(77, 208, 255, .18);
  transform: translateY(-1px);
}

.rlmain tg[fc="order"] { color: var(--rl-order); border-color: rgba(77, 208, 255, .5); background: rgba(77, 208, 255, .1); }
.rlmain tg[fc="chaos"] { color: var(--rl-chaos); border-color: rgba(255, 45, 85, .5); background: rgba(255, 45, 85, .1); }
.rlmain tg[fc="nature"] { color: var(--rl-nature); border-color: rgba(61, 220, 151, .5); background: rgba(61, 220, 151, .1); }
.rlmain tg[fc="none"] { color: var(--rl-txt2); border-color: var(--rl-line2); background: rgba(28, 36, 64, .6); }

/* ---------- 21-13 <av> = .rlava ---------- */
.rlmain av {
    display: block;  
  position: relative;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  background:
    radial-gradient(circle at 50% 38%, rgba(77, 208, 255, .3), transparent 62%),
    linear-gradient(145deg, rgba(34, 48, 82, .95), rgba(8, 10, 16, .98));
  border: 1px solid var(--rl-line2);
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  transition: filter .25s ease-out;
}

.rlmain av::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--rl-order);
  opacity: .75;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='9' r='3.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.6 20c0-3.6 2.9-6.2 6.4-6.2s6.4 2.6 6.4 6.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='9' r='3.4' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.6 20c0-3.6 2.9-6.2 6.4-6.2s6.4 2.6 6.4 6.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
  -webkit-mask-size: 30px 30px;
  mask-size: 30px 30px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.rlmain cd:hover av {
  filter: drop-shadow(0 0 8px rgba(77, 208, 255, .6));
}

/* ---------- 21-14 <lk> = .rllock ---------- */
.rlmain lk {
  display: inline-block;
  width: 13px;
  height: 13px;
  vertical-align: -2px;
  background-color: var(--rl-gold);
  filter: drop-shadow(0 0 5px rgba(255, 201, 77, .8));
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='5' y='10.4' width='14' height='10.4' rx='1.4' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M8.4 10.4V7.8a3.6 3.6 0 0 1 7.2 0v2.6' fill='none' stroke='black' stroke-width='1.7'/%3E%3Ccircle cx='12' cy='15.4' r='1.3' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='5' y='10.4' width='14' height='10.4' rx='1.4' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M8.4 10.4V7.8a3.6 3.6 0 0 1 7.2 0v2.6' fill='none' stroke='black' stroke-width='1.7'/%3E%3Ccircle cx='12' cy='15.4' r='1.3' fill='black'/%3E%3C/svg%3E");
  -webkit-mask-size: 13px 13px;
  mask-size: 13px 13px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  animation: rlBreath 2.8s ease-in-out infinite;
}

/* ---------- 21-15 <dm> = .rldm ---------- */
.rlmain dm {
  display: flex;
  align-items: baseline;
  gap: 7px;
  padding: 4px 0;
  font-size: 11.5px;
  line-height: 1.5;
  border-bottom: 1px dashed rgba(34, 48, 82, .4);
}

.rlmain dm:last-child {
  border-bottom: 0;
}

.rlmain dm > tg {
  flex: 0 0 auto;
  min-width: 48px;
  padding: 1px 6px;
  font-size: 10px;
  text-align: center;
}

.rlmain dm > span {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--rl-txt);
  word-break: break-word;
  white-space: normal;
}

/* ---------- 21-16 <ac> = .rlaci ---------- */
.rlmain ac {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  box-sizing: border-box;
  padding: 6px 10px 6px 8px;
  margin: 0 0 4px;
  overflow: hidden;
  background: linear-gradient(90deg, rgba(28, 36, 64, .68), rgba(20, 26, 44, .34));
  border: 1px solid var(--rl-line);
  border-left: 2px solid var(--rl-line2);
  border-radius: 0 2px 2px 0;
  cursor: pointer;
  transition:
    background .2s ease-out,
    border-color .2s ease-out,
    border-left-color .2s ease-out,
    transform .22s var(--rl-ez-panel),
    box-shadow .22s ease-out;
}

.rlmain ac:last-child {
  margin-bottom: 0;
}

.rlmain ac::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -110%;
  width: 45%;
  height: 200%;
  background: linear-gradient(90deg, transparent, rgba(180, 220, 255, .12), transparent);
  transform: rotate(20deg);
  transition: left .55s var(--rl-ez-panel);
  pointer-events: none;
}

.rlmain ac:hover::before {
  left: 170%;
}

.rlmain ac:hover {
  background: linear-gradient(90deg, rgba(77, 208, 255, .14), rgba(20, 26, 44, .4));
  border-color: var(--rl-order-d);
  border-left-color: var(--rl-order);
  transform: translateX(4px);
  box-shadow: 0 0 10px rgba(77, 208, 255, .28);
}

.rlmain ac:active {
  transform: translateX(2px) scale(.995);
}

.rlmain ac > s {
  flex: 0 0 auto;
  box-sizing: border-box;
  min-width: 22px;
  padding: 1px 0;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 10px;
  font-weight: 700;
  color: var(--rl-txt2);
  text-align: center;
  text-decoration: none;
  letter-spacing: .5px;
  background: rgba(5, 7, 12, .8);
  border: 1px solid var(--rl-line2);
  border-radius: 1px;
  transition: color .2s ease-out, border-color .2s ease-out, background .2s ease-out;
}

.rlmain ac:hover > s {
  color: var(--rl-order);
  background: rgba(77, 208, 255, .14);
  border-color: var(--rl-order-d);
}

.rlmain ac > span {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--rl-txt);
}

/* 高风险 */
.rlmain ac[hi="1"] {
  background: linear-gradient(90deg, rgba(255, 45, 85, .13), rgba(20, 26, 44, .34));
  border-color: rgba(255, 45, 85, .34);
  border-left-color: var(--rl-chaos);
}

.rlmain ac[hi="1"] > s {
  color: var(--rl-chaos);
  background: rgba(255, 45, 85, .14);
  border-color: rgba(255, 45, 85, .42);
}

.rlmain ac[hi="1"] > span::after {
  content: 'RISK';
  display: inline-block;
  padding: 0 5px;
  margin-left: 6px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8.5px;
  font-weight: 700;
  color: var(--rl-chaos);
  letter-spacing: 1.2px;
  vertical-align: 1px;
  background: rgba(255, 45, 85, .16);
  border: 1px solid rgba(255, 45, 85, .45);
  border-radius: 1px;
  animation: rlBreath 1.6s ease-in-out infinite;
}

.rlmain ac[hi="1"]:hover {
  background: linear-gradient(90deg, rgba(255, 45, 85, .24), rgba(20, 26, 44, .4));
  border-color: var(--rl-chaos);
  box-shadow: 0 0 8px rgba(255, 45, 85, .6), 0 0 24px rgba(255, 45, 85, .3), 0 0 48px rgba(255, 45, 85, .12);
}

.rlmain ac[hi="1"]:hover > s {
  color: #fff;
  background: rgba(255, 45, 85, .34);
  border-color: var(--rl-chaos);
}

/* ---------- 21-17 <ms> = .rlmsg ---------- */
.rlmain ms {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  box-sizing: border-box;
  padding: 7px 10px 7px 12px;
  margin: 0 0 3px;
  background: linear-gradient(90deg, rgba(28, 36, 64, .5), rgba(28, 36, 64, 0));
  border-left: 2px solid var(--rl-line2);
  transition: background .18s ease-out, border-color .18s ease-out, padding-left .18s ease-out;
}
.rlmain ms:last-child {
  margin-bottom: 0;
}

.rlmain ms:hover {
  background: linear-gradient(90deg, rgba(77, 208, 255, .1), rgba(28, 36, 64, 0));
  border-left-color: var(--rl-order);
  padding-left: 16px;
}

.rlmain ms > tg {
  align-self: flex-start;
  margin: 0;
}

.rlmain ms > nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.rlmain ms > nav > s {
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 9.5px;
  font-weight: 600;
  color: var(--rl-txt3);
  text-decoration: none;
  letter-spacing: .8px;
}

.rlmain ms > nav > span {
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--rl-txt);
  word-break: break-word;
  white-space: normal;
}

/* 消息类型色条 */
.rlmain ms[mt="intel"] { border-left-color: var(--rl-order); }
.rlmain ms[mt="intel"]::after {
  content: 'INTEL';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: var(--rl-order);
  letter-spacing: 1.2px;
  background: rgba(77, 208, 255, .1);
  border: 1px solid rgba(77, 208, 255, .3);
  border-radius: 1px;
}
.rlmain ms[mt="intel"]:hover { border-left-color: var(--rl-order); }

.rlmain ms[mt="trade"] { border-left-color: var(--rl-gold); }
.rlmain ms[mt="trade"]::after {
  content: 'TRADE';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: var(--rl-gold);
  letter-spacing: 1.2px;
  background: rgba(255, 201, 77, .1);
  border: 1px solid rgba(255, 201, 77, .3);
  border-radius: 1px;
}
.rlmain ms[mt="trade"]:hover { border-left-color: var(--rl-gold); }

.rlmain ms[mt="recruit"] { border-left-color: var(--rl-nature); }
.rlmain ms[mt="recruit"]::after {
  content: 'RECRUIT';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: var(--rl-nature);
  letter-spacing: 1.2px;
  background: rgba(61, 220, 151, .1);
  border: 1px solid rgba(61, 220, 151, .3);
  border-radius: 1px;
}
.rlmain ms[mt="recruit"]:hover { border-left-color: var(--rl-nature); }

.rlmain ms[mt="warn"] { border-left-color: var(--rl-chaos); }
.rlmain ms[mt="warn"]::after {
  content: 'WARN';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: var(--rl-chaos);
  letter-spacing: 1.2px;
  background: rgba(255, 45, 85, .1);
  border: 1px solid rgba(255, 45, 85, .3);
  border-radius: 1px;
}
.rlmain ms[mt="warn"]:hover { border-left-color: var(--rl-chaos); }

.rlmain ms[mt="sys"] { border-left-color: #b968ff; }
.rlmain ms[mt="sys"]::after {
  content: 'SYSTEM';
  position: absolute;
  top: 7px;
  right: 8px;
  padding: 1px 5px;
  font-family: "Consolas", "SF Mono", monospace;
  font-size: 8px;
  font-weight: 700;
  color: #b968ff;
  letter-spacing: 1.2px;
  background: rgba(185, 104, 255, .1);
  border: 1px solid rgba(185, 104, 255, .3);
  border-radius: 1px;
}
.rlmain ms[mt="sys"]:hover { border-left-color: #b968ff; }

/* 紧急度 */
.rlmain ms[ur="2"] { border-left-width: 3px; }
.rlmain ms[ur="3"] { border-left-width: 4px; }

/* ---------- 21-18 tooltip位置修复（短标签版） ---------- */

/* g2第二列右对齐 */
.rlmain g2 > *:nth-child(2n) [c] > i {
  left: auto;
  right: 0;
}

.rlmain g2 > *:nth-child(2n) [c] > i::before {
  left: auto;
  right: 14px;
}

.rlmain g2 > *:nth-child(2n) [c] > i::after {
  left: auto;
  right: 15px;
}

/* g3第三列右对齐 */
.rlmain g3 > *:nth-child(3n) [c] > i {
  left: auto;
  right: 0;
}

.rlmain g3 > *:nth-child(3n) [c] > i::before {
  left: auto;
  right: 14px;
}

.rlmain g3 > *:nth-child(3n) [c] > i::after {
  left: auto;
  right: 15px;
}

/* g3第二列居中 */
.rlmain g3 > *:nth-child(3n-1) [c] > i {
  left: 50%;
  transform: translateX(-50%);
}

.rlmain g3 > *:nth-child(3n-1) [c] > i::before,
.rlmain g3 > *:nth-child(3n-1) [c] > i::after {
  left: 50%;
  transform: translateX(-50%);
}

/* ---------- 21-19 tooltip底部翻转（短标签版） ---------- */
.rlmain .rlpn > cd:nth-last-child(-n+3) [c] > i {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: 6px;
  transform: translateY(4px) scale(.96);
}

.rlmain .rlpn > cd:nth-last-child(-n+3) [c]:hover > i {
  transform: translateY(0) scale(1);
}

.rlmain .rlpn > cd:nth-last-child(-n+3) [c] > i::before {
  bottom: auto;
  top: 100%;
  border-bottom-color: transparent;
  border-top-color: var(--rl-order-d);
}

.rlmain .rlpn > cd:nth-last-child(-n+3) [c] > i::after {
  bottom: auto;
  top: 100%;
  border-bottom-color: transparent;
  border-top-color: rgba(12, 16, 28, .98);
}

/* ---------- 21-20 容错：短标签嵌套压平 ---------- */
.rlmain cd cd {
  margin: 9px 0 0;
  padding: 9px 11px;
  background: rgba(20, 26, 44, .5);
  border-color: var(--rl-line);
  clip-path: none;
  filter: none;
}

.rlmain cd cd::before,
.rlmain cd cd::after {
  display: none;
}

.rlmain cd cd:hover {
  transform: none;
  filter: none;
  border-color: var(--rl-order-d);
}

/* 裸露组件补壳 */
.rlmain .rlpn > t,
.rlmain .rlpn > g2,
.rlmain .rlpn > g3 {
  box-sizing: border-box;
  padding: 9px 11px;
  margin: 0 0 9px;
  background: linear-gradient(150deg, rgba(28, 36, 64, .85), rgba(14, 18, 32, .92));
  border: 1px solid var(--rl-line2);
  clip-path: polygon(var(--rl-cut) 0, 100% 0, 100% calc(100% - var(--rl-cut)), calc(100% - var(--rl-cut)) 100%, 0 100%, 0 var(--rl-cut));
}

.rlmain .rlpn > t {
  border-left: 2px solid var(--rl-order-d);
}

/* 嵌套网格降单列 */
.rlmain g2 :is(g2, g3),
.rlmain g3 :is(g2, g3) {
  grid-template-columns: minmax(0, 1fr);
  margin-bottom: 0;
}

/* ---------- 21-21 hover层级链（短标签版） ---------- */
.rlmain [c]:hover {
  z-index: 100000;
}

.rlmain [c]:hover > i {
  z-index: 100001;
}

.rlmain .rlstbd:has([c]:hover) {
  z-index: 200;
}

.rlmain .rlpn:has([c]:hover) {
  z-index: 201;
}

.rlmain cd:has([c]:hover) {
  z-index: 202;
  filter: none;
}

/* ---------- 21-22 data-sec缩写tooltip映射（覆盖17节） ---------- */
.rlmain .rlsec[data-sec="p"] > .rlseclbl::after { content: '基础档案'; }
.rlmain .rlsec[data-sec="a"] > .rlseclbl::after { content: '属性面板'; }
.rlmain .rlsec[data-sec="c"] > .rlseclbl::after { content: '战斗配置'; }
.rlmain .rlsec[data-sec="b"] > .rlseclbl::after { content: '据点'; }
.rlmain .rlsec[data-sec="t"] > .rlseclbl::after { content: '冒险团'; }
.rlmain .rlsec[data-sec="m"] > .rlseclbl::after { content: '世界与任务'; }
.rlmain .rlsec[data-sec="r"] > .rlseclbl::after { content: '大区'; }
.rlmain .rlsec[data-sec="d"] > .rlseclbl::after { content: '小区'; }

/* ---------- 21-23 data-sec缩写图标映射（覆盖17节） ---------- */
.rlmain .rlsec[data-sec="p"] > .rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='3' width='16' height='18' rx='1.6' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='10' r='3' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M7.4 18.6c0-2.6 2.1-4.4 4.6-4.4s4.6 1.8 4.6 4.4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='3' width='16' height='18' rx='1.6' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='10' r='3' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M7.4 18.6c0-2.6 2.1-4.4 4.6-4.4s4.6 1.8 4.6 4.4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.rlmain .rlsec[data-sec="a"] > .rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4 14.8 8.6 21.6 9.6 16.8 14.2 18 21 12 17.8 6 21 7.2 14.2 2.4 9.6 9.2 8.6Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4 14.8 8.6 21.6 9.6 16.8 14.2 18 21 12 17.8 6 21 7.2 14.2 2.4 9.6 9.2 8.6Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.rlmain .rlsec[data-sec="c"] > .rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.4 3.6V7l3.4 3.4h3.4M6.2 17.8l11.6-11.6M9.6 3.6V7L6.2 10.4H2.8M17.8 17.8L6.2 6.2' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.2 14.8l2 2M14.8 7.2l2 2' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.4 3.6V7l3.4 3.4h3.4M6.2 17.8l11.6-11.6M9.6 3.6V7L6.2 10.4H2.8M17.8 17.8L6.2 6.2' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.2 14.8l2 2M14.8 7.2l2 2' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.rlmain .rlsec[data-sec="b"] > .rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.4 21V9.6L12 4.2l6.6 5.4V21Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9.6 21v-5.4h4.8V21' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M9 11.4h1.8M13.2 11.4H15' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.4 21V9.6L12 4.2l6.6 5.4V21Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9.6 21v-5.4h4.8V21' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M9 11.4h1.8M13.2 11.4H15' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.rlmain .rlsec[data-sec="t"] > .rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3v18' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3Cpath d='M6 4.2h12.6l-3.6 4.2 3.6 4.2H6' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3v18' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3Cpath d='M6 4.2h12.6l-3.6 4.2 3.6 4.2H6' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.rlmain .rlsec[data-sec="m"] > .rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.2 3.6c-1.4 0-2.6.8-2.6 1.8v13.2c0 1 1.2 1.8 2.6 1.8h9.6c1.4 0 2.6-.8 2.6-1.8V5.4c0-1-1.2-1.8-2.6-1.8Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9 8.4h6M9 12h4.8M9 15.6h3' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.2 3.6c-1.4 0-2.6.8-2.6 1.8v13.2c0 1 1.2 1.8 2.6 1.8h9.6c1.4 0 2.6-.8 2.6-1.8V5.4c0-1-1.2-1.8-2.6-1.8Z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M9 8.4h6M9 12h4.8M9 15.6h3' stroke='black' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.rlmain .rlsec[data-sec="r"] > .rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M12 3v3.6M12 17.4V21M3 12h3.6M17.4 12H21' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M14.8 9.2l-6.6 2 2 6.6 6.6-2Z' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M12 3v3.6M12 17.4V21M3 12h3.6M17.4 12H21' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M14.8 9.2l-6.6 2 2 6.6 6.6-2Z' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.rlmain .rlsec[data-sec="d"] > .rlseclbl::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.6 20V10.8h5.4V20M9 20V6h6v14M15 20V10.8h5.4V20' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M11.2 9h1.6M11.2 12.6h1.6M11.2 16.2h1.6M5.2 13.8h1.8M16.8 13.8h1.8' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.6 20V10.8h5.4V20M9 20V6h6v14M15 20V10.8h5.4V20' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M11.2 9h1.6M11.2 12.6h1.6M11.2 16.2h1.6M5.2 13.8h1.8M16.8 13.8h1.8' stroke='black' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* ---------- 21-24 窄屏适配（短标签版） ---------- */
@container rlbox (max-width: 460px) {
  .rlmain ac > span {
    font-size: 11.5px;
    line-height: 1.55;
  }
}

@container rlbox (max-width: 350px) {
  .rlmain g2,
  .rlmain g3 {
    grid-template-columns: minmax(0, 1fr);
  }
}

@container rlbox (max-width: 420px) {
  .rlmain [c] > i {
    width: calc(100cqw - 72px);
    max-width: none;
    font-size: 10px;
    line-height: 1.5;
  }
  .rlmain [c] > i::before,
  .rlmain [c] > i::after {
    display: none;
  }
}

@container rlbox (min-width: 620px) {
  .rlmain .rlactbd ac {
    margin-bottom: 0;
  }
}

/* ---------- 21-25 rlp0内cd与rlsecbd兼容（短标签在details内） ---------- */
.rlmain .rlsecbd > cd {
  margin: 0 0 9px;
}

.rlmain .rlsecbd:has([c]:hover) {
  overflow: visible;
  z-index: 9000;
}

.rlmain .rlsec:has([c]:hover) {
  z-index: 9001;
  overflow: visible;
}

/* ---------- 21-26 面板动画继承 ---------- */
.rlmain .rlpn > cd {
  animation: rlItemIn .5s var(--rl-ez-panel) both;
}

.rlmain .rlpn > cd:nth-child(1) { animation-delay: .06s; }
.rlmain .rlpn > cd:nth-child(2) { animation-delay: .1s; }
.rlmain .rlpn > cd:nth-child(3) { animation-delay: .14s; }
.rlmain .rlpn > cd:nth-child(4) { animation-delay: .18s; }
.rlmain .rlpn > cd:nth-child(5) { animation-delay: .22s; }
.rlmain .rlpn > cd:nth-child(6) { animation-delay: .26s; }

/* ---------- 21-27 杂标签兜底隐藏 ---------- */
.rlmain wldata,
.rlmain anchor {
  display: none !important;
}

/* ============================================================
   END OF TOKEN SAVER ALIASES
   ============================================================ */


/* ============================================================
   22. 修复补丁 · 必须置于内置CSS最末尾
   ============================================================ */

/* ---------- 22-1 修正 @container 语法（原三块因缺空格整体失效） ---------- */
@container rlbox (max-width: 460px) {
  .rlmain .rlmsgbox { max-height: 180px; }
  .rlmain ms { padding: 6px 8px 6px 10px; }
  .rlmain ms > nav > span { font-size: 11px; }
  .rlmain .rlmsghd { height: 34px; padding: 0 10px; }
  .rlmain .rlmsghd > b { font-size: 9.5px; letter-spacing: 1.2px; }
}

@container rlbox (max-width: 350px) {
  .rlmain .rlsec > .rlseclbl { width: 30px; height: 28px; }
  .rlmain .rlsec > .rlseclbl::before {
    width: 13px; height: 13px;
    -webkit-mask-size: 13px 13px; mask-size: 13px 13px;
  }
  .rlmain .rlsecbar { padding-top: 36px; min-height: 36px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(1) > .rlseclbl { left: 0; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(2) > .rlseclbl { left: 35px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(3) > .rlseclbl { left: 70px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(4) > .rlseclbl { left: 105px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(5) > .rlseclbl { left: 140px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(6) > .rlseclbl { left: 175px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(7) > .rlseclbl { left: 210px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(8) > .rlseclbl { left: 245px; }
  .rlmain .rlsec > .rlseclbl::after,
  .rlmain .rlsec-npc > .rlseclbl > span { display: none; }
  .rlmain .rlcg-img { aspect-ratio: 2/3; }
  .rlmain .rlcg-sw > summary { width: 30px; height: 30px; }
  .rlmain .rlcg-sw > summary::before {
    width: 14px; height: 14px;
    -webkit-mask-size: 14px 14px; mask-size: 14px 14px;
  }
}

/* ---------- 22-2 修复 CG 切换按钮 webkit 路径截断 ---------- */
.rlmain .rlcg-sw > summary::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17 1l4 4-4 4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3 11V9a4 4 0 0 1 4-4h14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M7 23l-4-4 4-4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M21 13v2a4 4 0 0 1-4 4H3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* ---------- 22-3 rlp0/rlp1/rlp3 内 tooltip 上翻 ----------
   cd 在 .rlsecbd 内，21-19 的 .rlpn>cd 选择器打不中，
   改为按 cd 内部末尾位置判定 */
.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: 6px;
  transform: translateY(4px) scale(.96);
}

.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) [c]:hover > i {
  transform: translateY(0) scale(1);
}

.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i::before {
  bottom: auto;
  top: 100%;
  border-bottom-color: transparent;
  border-top-color: var(--rl-order-d);
}

.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i::after {
  bottom: auto;
  top: 100%;
  border-bottom-color: transparent;
  border-top-color: rgba(12, 16, 28, .98);
}

/* ---------- 22-4 底部渐变遮罩补短标签选择器 ---------- */
.rlmain .rlstbd:has([c]:hover)::after {
  opacity: 0;
  transition: opacity .18s ease-out;
}

/* ---------- 22-5 消息区 tooltip 防裁剪补短标签 ---------- */
.rlmain ms:has([c]:hover) { z-index: 9000; }
.rlmain .rlmsgbox:has([c]:hover) { overflow: visible; }
.rlmain .rlmsgcard:has([c]:hover) {
  z-index: 202;
  clip-path: none;
  filter: none;
  overflow: visible;
}

/* ---------- 22-6 结构报警补短标签检测 ---------- */
.rlmain:has(cd cd) .rlsthd > i,
.rlmain:has(.rlpn > t) .rlsthd > i,
.rlmain:has(.rlpn > g2) .rlsthd > i,
.rlmain:has(.rlpn > g3) .rlsthd > i {
  width: 5px;
  background: var(--rl-chaos);
  filter: drop-shadow(0 0 7px rgba(255, 45, 85, .95));
  animation: rlBreath 1s ease-in-out infinite;
}

/* ============================================================23. 移动端紧凑化补丁 · MOBILE COMPACT PATCH
   追加至内置CSS最末尾
   ============================================================ */

/* ========== 23-1 中等手机 ≤520px ========== */
@media (max-width: 520px) {

  /* --- 容器整体 --- */
  .rlmain {
    height: calc(100dvh - 80px);
    min-height: 340px;
    max-height: none;
    font-size: 12px;
    line-height: 1.6;
    border-radius: 2px;
    margin: 1px 0;
    overflow: visible;
  }

  /* --- 顶栏 58→38 --- */
  .rlmain .rltop {
    height: 38px;
    padding-right: 8px;
  }

  .rlmain .rlsigil {
    width: 38px;
    height: 38px;
  }

  .rlmain .rlsigil::before {
    -webkit-mask-size: 20px 20px;
    mask-size: 20px 20px;
  }

  .rlmain .rlsigil::after {
    width: 28px;
    height: 28px;
    margin: -14px 0 0 -14px;
  }

  .rlmain .rlslot {
    height: 38px;
    padding: 0 8px;
    gap: 4px;
  }

  .rlmain .rlslot > i {
    width: 14px;
    height: 14px;
    -webkit-mask-size: 14px 14px;
    mask-size: 14px 14px;
  }

  .rlmain .rlslot > u > s {
    display: none;
  }

  .rlmain .rlslot > u > b {
    font-size: 11px;}

  .rlmain .rlslot.rltime > u > b {
    font-size: 11.5px;
  }

  /*天气图标缩小*/
  .rlmain .rlwx::before,
  .rlmain w::before {
    width: 14px;
    height: 14px;
    -webkit-mask-size: 14px 14px;
    mask-size: 14px 14px;
  }

  .rlmain .rlwx,
  .rlmain w {
    font-size: 11px;gap: 3px;
  }

  /*危险度标签缩小 */
  .rlmain .rldg,
  .rlmain dg {
    padding: 1px 5px;
    font-size: 8.5px;
  }

  .rlmain .rldg::before,
  .rlmain dg::before {
    width: 10px;
    height: 10px;
    -webkit-mask-size: 10px 10px;
    mask-size: 10px 10px;margin-right: 2px;
  }

  /*设置按钮缩小 */
  .rlmain .rlsetbtn {
    width: 28px;
    height: 28px;
    margin-left: 5px;
  }

  .rlmain .rlsetbtn::before {
    width: 14px;
    height: 14px;
    -webkit-mask-size: 14px 14px;
    mask-size: 14px 14px;
  }

  /* --- 导航栏 74→48 --- */
  .rlmain .rlnavbar {
    height: 48px;}

  .rlmain .rlbtn {
    padding: 4px 1px 5px;
    gap: 2px;
  }

  .rlmain .rlbtn i {
    width: 20px;
    height: 20px;
    -webkit-mask-size: 20px 20px;
    mask-size: 20px 20px;
  }

  .rlmain .rlbtn span {
    font-size: 8.5px;
    letter-spacing: 0;
  }

  /* --- 正文区 --- */
  .rlmain .rlbody {
    padding: 10px 10px 14px 20px;
  }

  .rlmain .rlbody p {
    font-size: 12.5px;
    line-height: 1.8;
    margin-bottom: 10px;
  }

  /*左侧装饰竖线缩窄 */
  .rlmain .rlbody {
    background-position: 8px 0, 8px 0;
    background-size: 2px 100%, 2px 100%;
  }

  /* --- 行动建议区 --- */
  .rlmain .rlacthd {
    height: 26px;
    padding: 0 8px;
    gap: 5px;
  }

  .rlmain .rlacthd > i {
    width: 12px;
    height: 12px;
    -webkit-mask-size: 12px 12px;
    mask-size: 12px 12px;
  }

  .rlmain .rlacthd > b {
    font-size: 9px;
    letter-spacing: 1.2px;
  }

  .rlmain .rlactar {
    width: 12px;
    height: 12px;
    -webkit-mask-size: 12px 12px;
    mask-size: 12px 12px;
  }

  .rlmain .rlactbd {
    max-height: 220px !important;
    padding: 0 8px 6px;
  }

  .rlmain .rlaci,
  .rlmain ac {
    padding: 4px 7px 4px 6px;
    gap: 6px;
    margin-bottom: 3px;
  }

  .rlmain .rlaci > s,
  .rlmain ac > s {
    min-width: 18px;
    font-size: 9px;
  }

  .rlmain .rlaci > span,
  .rlmain ac > span {
    font-size: 11px;
    line-height: 1.5;
  }

  /* --- 舞台头部 44→34 --- */
  .rlmain .rlsthd {
    height: 34px;
    padding: 0 6px 0 10px;
    gap: 6px;
  }

  .rlmain .rlsthd > b {
    font-size: 10.5px;
    letter-spacing: 1.6px;
  }

  .rlmain .rlstclose {
    height: 24px;
    padding: 0 7px 0 5px;
    gap: 3px;
  }

  .rlmain .rlstclose::before {
    width: 12px;
    height: 12px;
    -webkit-mask-size: 12px 12px;
    mask-size: 12px 12px;
  }

  .rlmain .rlstclose::after {
    font-size: 9px;
  }

  /* --- 面板内组件缩小 --- */
  .rlmain .rlpn {
    padding: 9px 10px 28px;}

  .rlmain .rlcard,
  .rlmain cd {
    padding: 8px 10px;margin-bottom: 7px;
  }

  .rlmain .rlrow,
  .rlmain t {
    padding: 3px 6px;
    font-size: 11.5px;
    gap: 6px;
    margin-bottom: 2px;
  }

  .rlmain .rlrow > b,
  .rlmain t > b {
    font-size: 10px;
    min-width: 52px;
  }

  .rlmain .rltag,
  .rlmain tg {
    padding: 1px 6px;
    font-size: 9.5px;
  }

  .rlmain .rlcap,
  .rlmain [c] {
    padding: 1px 6px;
    font-size: 9.5px;
  }

  .rlmain .rlcap > i,
  .rlmain [c] > i {
    width: calc(100vw - 80px);
    max-width: 280px;
    padding: 7px 9px;
    font-size: 10px;
    line-height: 1.5;
  }

  .rlmain .rlnum,
  .rlmain n {
    font-size: 12px;
  }

  .rlmain .rlgrid2,
  .rlmain g2 {
    gap: 3px 6px;
    margin-bottom: 6px;
  }

  .rlmain .rlgrid3,
  .rlmain g3 {
    gap: 3px 5px;
    margin-bottom: 6px;
  }

  .rlmain .rldiv,
  .rlmain d {
    margin: 7px 0;
  }

  /*头像缩小 */
  .rlmain .rlava,
  .rlmain av {
    width: 38px;
    height: 38px;
  }

  .rlmain .rlava::before,
  .rlmain av::before {
    -webkit-mask-size: 24px 24px;
    mask-size: 24px 24px;
  }

  /* --- 分类标签栏缩小 --- */
  .rlmain .rlsecbar {
    padding-top: 34px;
    min-height: 34px;}

  .rlmain .rlsec > .rlseclbl {
    width: 32px;
    height: 30px;
  }

  .rlmain .rlsec > .rlseclbl::before {
    width: 14px;
    height: 14px;
    -webkit-mask-size: 14px 14px;
    mask-size: 14px 14px;
  }

  .rlmain .rlsecbar > .rlsec:nth-of-type(1) > .rlseclbl { left: 0; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(2) > .rlseclbl { left: 37px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(3) > .rlseclbl { left: 74px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(4) > .rlseclbl { left: 111px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(5) > .rlseclbl { left: 148px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(6) > .rlseclbl { left: 185px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(7) > .rlseclbl { left: 222px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(8) > .rlseclbl { left: 259px; }

  /* --- 设置面板：内容自适应、下拉式对齐设置按钮下方 --- */
  .rlmain .rlview > .rlsetpanel {
    top: 0;
    bottom: auto;
    width: auto;
    max-width: 88%;
    max-height: 65vh;
  }

  .rlmain .rlsethd {
    height: 44px;
    padding: 0 10px 0 12px;
  }

  .rlmain .rlsethd > b {
    font-size: 11px;
    letter-spacing: 1.8px;
  }

  .rlmain .rlsetbd {
    padding: 10px 10px 16px;
  }

  .rlmain .rlsetitem {
    padding: 7px 9px;
    gap: 8px;
    margin-bottom: 4px;
  }

  .rlmain .rlsetitem > u > b {
    font-size: 11px;
  }

  .rlmain .rlsetitem > u > s {
    font-size: 9px;
  }

  .rlmain .rlsetval {
    padding: 2px 7px;
    font-size: 10px;
  }

  .rlmain .rlseti {
    width: 15px;
    height: 15px;
    -webkit-mask-size: 15px 15px;
    mask-size: 15px 15px;
  }

  .rlmain .rlclose {
    width: 28px;
    height: 28px;
  }

  .rlmain .rlclose::before {
    -webkit-mask-size: 14px 14px;
    mask-size: 14px 14px;
  }

  /* --- 消息终端 --- */
  .rlmain .rlmsghd {
    height: 32px;
    padding: 0 8px;
  }

  .rlmain .rlmsghd > i {
    width: 13px;
    height: 13px;
    -webkit-mask-size: 13px 13px;
    mask-size: 13px 13px;
  }

  .rlmain .rlmsghd > b {
    font-size: 9px;
    letter-spacing: 1px;
  }

  .rlmain .rlmsgbox {
    max-height: 160px;
  }

  .rlmain .rlmsg,
  .rlmain ms {
    padding: 5px 8px 5px 9px;
  }

  .rlmain .rlmsg > nav > span,
  .rlmain ms > nav > span {
    font-size: 10.5px;
  }

  /* --- CG立绘 --- */
  .rlmain .rlcg-img {
    aspect-ratio: 5/6;
  }

  /* --- 弹幕区--- */
  .rlmain .rldmbox {
    height: 150px;
  }

  .rlmain .rldm,
  .rlmain dm {
    font-size: 10.5px;
    padding: 3px 0;
  }

  /* --- 遮罩覆盖rlview全区（面板已改为下拉式，无需负偏移） --- */
  .rlmain .rlview > .rlmask {
    top: 0;
    bottom: 0;
  }
}

/* ========== 23-2 小屏手机 ≤390px ========== */
@media (max-width: 390px) {

  .rlmain {
    height: calc(100dvh - 56px);
    min-height: 300px;
    font-size: 11.5px;
    margin: 0;}

  /*顶栏进一步压缩 38→32 */
  .rlmain .rltop {
    height: 32px;
    padding-right: 6px;
  }

  .rlmain .rlsigil {
    width: 32px;
    height: 32px;
  }

  .rlmain .rlsigil::before {
    -webkit-mask-size: 16px 16px;
    mask-size: 16px 16px;
  }

  .rlmain .rlsigil::after {
    width: 24px;
    height: 24px;
    margin: -12px 0 0 -12px;
  }

  .rlmain .rlslot {
    height: 32px;
    padding: 0 6px;}

  .rlmain .rlslot > u > b {
    font-size: 10.5px;
  }

  .rlmain .rlslot.rltime > u > b {
    font-size: 11px;
  }

  /*隐藏天气槽（太窄放不下） */
  .rlmain .rlslot.rlwrap {
    display: none;
  }

  /*导航栏 48→40 +隐藏文字 */
  .rlmain .rlnavbar {
    height: 40px;
  }

  .rlmain .rlbtn span {
    display: none;
  }

  .rlmain .rlbtn i {
    width: 22px;
    height: 22px;
    -webkit-mask-size: 22px 22px;
    mask-size: 22px 22px;
  }

  .rlmain .rlbtn {
    padding: 4px 1px;}

  /* 正文进一步紧凑 */
  .rlmain .rlbody {
    padding: 8px 8px 12px 16px;
    background-position: 6px 0, 6px 0;
  }

  .rlmain .rlbody p {
    font-size: 12px;
    line-height: 1.75;
    margin-bottom: 8px;text-indent: 1.2em;
  }

  /* 行动建议进一步收紧 */
  .rlmain .rlactbd {
    max-height: 180px !important;
  }

  .rlmain .rlaci > span,
  .rlmain ac > span {
    font-size: 10.5px;
  }

  /* 舞台头 34→30 */
  .rlmain .rlsthd {
    height: 30px;
    padding: 0 5px 0 8px;
  }

  .rlmain .rlsthd > b {
    font-size: 9.5px;
    letter-spacing: 1.2px;
  }

  .rlmain .rlstclose::after {
    display: none;
  }

  .rlmain .rlstclose {
    width: 24px;
    height: 24px;
    padding: 0;justify-content: center;
  }

  /* 面板内 */
  .rlmain .rlpn {
    padding: 7px 8px 24px;
  }

  .rlmain .rlcard,
  .rlmain cd {
    padding: 6px 8px;
    margin-bottom: 5px;
  }

  .rlmain .rlgrid2,
  .rlmain g2,
  .rlmain .rlgrid3,
  .rlmain g3 {
    grid-template-columns: minmax(0, 1fr);}

  /* 分类标签栏更小 */
  .rlmain .rlsecbar {
    padding-top: 30px;
    min-height: 30px;
  }

  .rlmain .rlsec > .rlseclbl {
    width: 28px;
    height: 26px;
  }

  .rlmain .rlsec > .rlseclbl::before {
    width: 12px;
    height: 12px;
    -webkit-mask-size: 12px 12px;
    mask-size: 12px 12px;
  }

  .rlmain .rlsecbar > .rlsec:nth-of-type(1) > .rlseclbl { left: 0; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(2) > .rlseclbl { left: 33px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(3) > .rlseclbl { left: 66px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(4) > .rlseclbl { left: 99px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(5) > .rlseclbl { left: 132px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(6) > .rlseclbl { left: 165px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(7) > .rlseclbl { left: 198px; }
  .rlmain .rlsecbar > .rlsec:nth-of-type(8) > .rlseclbl { left: 231px; }

  .rlmain .rlsec > .rlseclbl::after {
    display: none;
  }

  /* tooltip hover在小屏禁用箭头 */
  .rlmain .rlcap > i::before,
  .rlmain .rlcap > i::after,
  .rlmain [c] > i::before,
  .rlmain [c] > i::after {
    display: none;
  }

  /* 设置按钮*/
  .rlmain .rlsetbtn {
    width: 28px;
    height: 28px;
  }

  .rlmain .rlsetbtn::before {
    width: 14px;
    height: 14px;
    -webkit-mask-size: 14px 14px;
    mask-size: 14px 14px;
  }

  .rlmain .rlsetbtn::after {
    display: none;
  }

  /* 遮罩覆盖rlview全区 */
  .rlmain .rlview > .rlmask {
    top: 0;
    bottom: 0;
  }
}

/* ========== 23-3 极小屏 ≤340px（iPhone SE 1代等） ========== */
@media (max-width: 340px) {

  .rlmain {
    height: calc(100dvh - 44px);
    min-height: 280px;
    margin: 0;
  }

  .rlmain .rltop {
    height: 28px;
  }

  .rlmain .rlsigil {
    width: 28px;
    height: 28px;
  }

  .rlmain .rlslot {
    height: 28px;
    padding: 0 5px;
  }

  .rlmain .rlslot > i {
    width: 12px;
    height: 12px;
    -webkit-mask-size: 12px 12px;
    mask-size: 12px 12px;
  }

  .rlmain .rlslot > u > b {
    font-size: 10px;
  }

  .rlmain .rlnavbar {
    height: 36px;
  }

  .rlmain .rlbtn i {
    width: 20px;
    height: 20px;
    -webkit-mask-size: 20px 20px;
    mask-size: 20px 20px;
  }

  .rlmain .rlbody {
    padding: 6px 6px 10px 14px;
    background-position: 5px 0, 5px 0;
  }

  .rlmain .rlbody p {
    font-size: 11.5px;
    line-height: 1.7;
    text-indent: 1em;
  }

  .rlmain .rlactbd {
    max-height: 160px !important;
  }

  .rlmain .rlview > .rlmask {
    top: 0;
    bottom: 0;
  }
}

/* ============================================================24. 移动端终极修复 · MOBILE ULTIMATE FIX v2
   替换旧版24节 · 必须置于内置CSS最末尾
   ============================================================ */

/* ---------- 24-1 input反滚动：display:none 彻底脱离渲染树 ----------
   display:none使元素完全无渲染盒，浏览器focus时scrollIntoView找不到目标，不会滚动任何祖先容器。
   label的for关联、:checked状态、~兄弟选择器均基于DOM树工作，不受display:none影响。
   之前用absolute/fixed+top:0仍会触发页面滚动，因为元素仍在布局树中。 */
.rlmain input.rlrd,
.rlmain input.rlck {
  display: none !important;
}

/* ---------- 24-2 tooltip居中 + 宽度自适应（全局基础） ---------- */
.rlmain [c] > i,
.rlmain .rlcap > i {
  left: 50% !important;
  right: auto !important;
  width: auto;
  min-width: 160px;
  max-width: min(300px, calc(100cqw - 36px));
  transform: translateX(-50%) translateY(-4px) scale(.96);
}

.rlmain [c]:hover > i,
.rlmain .rlcap:hover > i {
  transform: translateX(-50%) translateY(0) scale(1);
}

/* 箭头居中 */
.rlmain [c] > i::before,
.rlmain .rlcap > i::before {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
}

.rlmain [c] > i::after,
.rlmain .rlcap > i::after {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
}

/* ---------- 24-3 覆盖所有列对齐残留（g2/g3全列） ----------
   用!important 确保不被前面更高特异性的规则盖回去*/
.rlmain g2 > * [c] > i,
.rlmain g3 > * [c] > i,
.rlmain .rlgrid2 > * [c] > i,
.rlmain .rlgrid3 > * [c] > i,
.rlmain .rlgrid2 > * .rlcap > i,
.rlmain .rlgrid3 > * .rlcap > i {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) translateY(-4px) scale(.96);
}

.rlmain g2 > * [c]:hover > i,
.rlmain g3 > * [c]:hover > i,
.rlmain .rlgrid2 > * [c]:hover > i,
.rlmain .rlgrid3 > * [c]:hover > i,
.rlmain .rlgrid2 > * .rlcap:hover > i,
.rlmain .rlgrid3 > * .rlcap:hover > i {
  transform: translateX(-50%) translateY(0) scale(1);
}

.rlmain g2 > * [c] > i::before,
.rlmain g2 > * [c] > i::after,
.rlmain g3 > * [c] > i::before,
.rlmain g3 > * [c] > i::after,
.rlmain .rlgrid2 > * [c] > i::before,
.rlmain .rlgrid2 > * [c] > i::after,
.rlmain .rlgrid3 > * [c] > i::before,
.rlmain .rlgrid3 > * [c] > i::after,
.rlmain .rlgrid2 > * .rlcap > i::before,
.rlmain .rlgrid2 > * .rlcap > i::after,
.rlmain .rlgrid3 > * .rlcap > i::before,
.rlmain .rlgrid3 > * .rlcap > i::after {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
}

/* ---------- 24-4 向上翻转时也居中 ---------- */
.rlmain .rlpn > cd:nth-last-child(-n+3) [c] > i,
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) [c] > i,
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) .rlcap > i,
.rlmain .rlpn > cd:nth-last-child(-n+2) [c] > i,
.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i,
.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) .rlcap > i {
  left: 50% !important;
  right: auto !important;
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: 6px;
  transform: translateX(-50%) translateY(4px) scale(.96);
}

.rlmain .rlpn > cd:nth-last-child(-n+3) [c]:hover > i,
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) [c]:hover > i,
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) .rlcap:hover > i,
.rlmain .rlpn > cd:nth-last-child(-n+2) [c]:hover > i,
.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) [c]:hover > i,
.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) .rlcap:hover > i {
  transform: translateX(-50%) translateY(0) scale(1);
}

/* 向上箭头也居中 */
.rlmain .rlpn > cd:nth-last-child(-n+3) [c] > i::before,
.rlmain .rlpn > cd:nth-last-child(-n+3) [c] > i::after,
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) [c] > i::before,
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) [c] > i::after,
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) .rlcap > i::before,
.rlmain .rlpn > .rlcard:nth-last-child(-n+3) .rlcap > i::after,
.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i::before,
.rlmain .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i::after {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
}

/* ---------- 24-4b 小区(data-sec="d") 禁用向上翻转 ----------
   小区cd仅2个g2子元素，nth-last-child(-n+2)导致全部上翻，
   顶部标签(所在小区/相邻小区)tooltip上翻后超出rlpn顶部被overflow裁剪。
   大区cd有7个子元素仅末尾上翻故正常，此处仅对小区强制向下显示。 */
.rlmain .rlsec[data-sec="d"] .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i {
  top: 100% !important;
  bottom: auto !important;
  margin-top: 6px !important;
  margin-bottom: 0 !important;
  transform: translateX(-50%) translateY(-4px) scale(.96) !important;
}

.rlmain .rlsec[data-sec="d"] .rlsecbd > cd > *:nth-last-child(-n+2) [c]:hover > i {
  transform: translateX(-50%) translateY(0) scale(1) !important;
}

.rlmain .rlsec[data-sec="d"] .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i::before {
  bottom: 100% !important;
  top: auto !important;
  border-bottom-color: var(--rl-order-d) !important;
  border-top-color: transparent !important;
}

.rlmain .rlsec[data-sec="d"] .rlsecbd > cd > *:nth-last-child(-n+2) [c] > i::after {
  bottom: 100% !important;
  top: auto !important;
  border-bottom-color: rgba(12, 16, 28, .98) !important;
  border-top-color: transparent !important;
}

/* ---------- 24-5 [c][n] 数值型tooltip特殊处理 ----------
   数值型胶囊没有padding/border，tooltip起点不同 */
.rlmain [c][n] > i,
.rlmain .rlcap.rlcap-num > i {
  left: 50% !important;
  right: auto !important;
}

/* ---------- 24-6 移动端tooltip尺寸微调 ---------- */
@media (max-width: 520px) {
  .rlmain [c] > i,
  .rlmain .rlcap > i {
    min-width: 130px;
    max-width: min(280px, calc(100cqw - 28px));padding: 7px 9px;
    font-size: 10px;
    line-height: 1.5;
  }
}

@media (max-width: 390px) {
  .rlmain [c] > i,
  .rlmain .rlcap > i {
    min-width: 110px;
    max-width: min(250px, calc(100cqw - 20px));
    padding: 6px 8px;
  }

  /* 极窄屏隐藏箭头省空间 */
  .rlmain [c] > i::before,
  .rlmain [c] > i::after,
  .rlmain .rlcap > i::before,
  .rlmain .rlcap > i::after {
    display: none;
  }
}

/* ---------- 24-7 容器查询覆盖旧的固定宽度 ---------- */
@container rlbox (max-width: 420px) {
  .rlmain [c] > i,
  .rlmain .rlcap > i {
    width: auto;
    min-width: 120px;
    max-width: calc(100cqw - 28px);
  }
}

/* ---------- 24-8 全局禁止平滑滚动 + 阻断滚动链 ----------
   禁用html/body的smooth滚动，使任何意外触发的scrollIntoView瞬时完成而非平滑滚动；
   overscroll-behavior:contain阻止.rlmain内部滚动链传导到页面级。 */
html, body {
  scroll-behavior: auto !important;
}
.rlmain {
  overscroll-behavior: contain;
}

/* ============================================================
   25. rili 平台适配层 —— 破宽度限制 / 渲染区基线 / 面板互斥 / 平台美化
   ------------------------------------------------------------
   平台默认给AI回复/输入框设 max-w-2xl(~672px) 把内容压窄；
   平台 HTML 净化器会剥离 radio 的 name 属性，导致 radio 无法分组互斥；
   本层解决以上三类问题，并对 shell 外的平台元素套用轮回乐园视觉系。
   配色：秩序青 #4dd0ff (AI/左) / 混沌红 #ff2d55 (玩家/右) / 金 #ffc94d
   ============================================================ */

/* ---------- 25-1 外层容器破限（全局，无 @media） ---------- */
.max-w-2xl,
div[class*="max-w-2xl"] {
  max-width: 920px !important;
}

/* AI 回复气泡解除宽度限制 */
div[class*="is-assistant"],
.group.is-assistant {
  max-width: none !important;
  width: 100% !important;
}

.group.is-assistant > .is-dark.bg-card,
div[class*="is-assistant"][class*="bg-card"] {
  max-width: none !important;
  width: 100% !important;
}

/* 玩家消息气泡解除宽度限制 */
div[class*="is-user"],
.group.is-user {
  max-width: none !important;
}

/* markdown 渲染器铺满 */
div.rili-markdown-renderer,
.group.is-assistant .rili-markdown-renderer {
  max-width: none !important;
  width: 100% !important;
}

/* AI 正文框铺满 */
article.story-main {
  max-width: none !important;
  width: 100% !important;
}

/* ---------- 25-2 输入栏破限（逐层突破父容器链） ---------- */
#prompt-input,
#ai-chat-bottom-input,
div[data-slot="input-group"],
div[data-slot="input-group"][role="group"] {
  max-width: 920px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#prompt-input [data-slot="input-group"],
#prompt-input > div,
#ai-chat-bottom-input > div {
  width: 100% !important;
  max-width: none !important;
}

#prompt-input-header,
#prompt-input-footer,
#prompt-input-header > div,
#prompt-input-footer > div {
  width: 100% !important;
  max-width: none !important;
}

#prompt-input textarea,
#ai-chat-bottom-input textarea {
  width: 100% !important;
  max-width: none !important;
}

/* 兜底：所有含 input/prompt/chat-bottom 的容器破限 */
div[class*="prompt-input"],
div[class*="chat-bottom"],
div[class*="input-group"] {
  max-width: 920px !important;
  width: 100% !important;
}

/* ---------- 25-3 渲染区文字基线（霞鹜文楷配套） ----------
   AI 正文 / markdown 渲染器统一使用霞鹜文楷，与 shell 内部字体呼应。 */
article.story-main,
.group.is-assistant .rili-markdown-renderer,
div.rili-markdown-renderer {
  font-family: 'LXGW WenKai', 'Noto Serif SC', 'Source Han Serif SC', 'STSong', 'SimSun', 'Georgia', serif !important;
  font-size: 15.5px !important;
  font-weight: 500 !important;
  line-height: 1.85 !important;
  letter-spacing: .35px !important;
  color: #c8d4e8 !important;
}

article.story-main p:not(.rlmain *),
.group.is-assistant .rili-markdown-renderer p:not(.rlmain *),
div.rili-markdown-renderer p:not(.rlmain *) {
  color: #c8d4e8 !important;
}

article.story-main :is(b, strong):not(.rlmain *),
div.rili-markdown-renderer :is(b, strong):not(.rlmain *) {
  color: #ffc94d !important;
  font-weight: 800 !important;
  text-shadow: 0 0 6px rgba(255, 201, 77, .35) !important;
}

.group.is-assistant .rili-markdown-renderer :is(h1, h2, h3):not(.rlmain *),
div.rili-markdown-renderer :is(h1, h2, h3):not(.rlmain *) {
  color: #4dd0ff !important;
  font-weight: 900 !important;
  letter-spacing: 1px !important;
  text-shadow: 0 0 8px rgba(77, 208, 255, .4) !important;
}

/* ---------- 25-4 面板互斥：checkbox 后选覆盖极简版 ----------
   平台 HTML 净化器剥离 radio 的 name 属性，导致 rlr0~rlr5 可同时选中。
   利用 :has() 实现"编号大压编号小"：当任一比当前面板编号大的面板被选中时，
   隐藏当前面板。多个面板同时 checked 时，显示编号最大的那个。 */
.rlmain:has(input.rlrd.rlr1:checked) .rlview .rlstbd > .rlpn.rlp0,
.rlmain:has(input.rlrd.rlr2:checked) .rlview .rlstbd > .rlpn.rlp0,
.rlmain:has(input.rlrd.rlr2:checked) .rlview .rlstbd > .rlpn.rlp1,
.rlmain:has(input.rlrd.rlr3:checked) .rlview .rlstbd > .rlpn.rlp0,
.rlmain:has(input.rlrd.rlr3:checked) .rlview .rlstbd > .rlpn.rlp1,
.rlmain:has(input.rlrd.rlr3:checked) .rlview .rlstbd > .rlpn.rlp2,
.rlmain:has(input.rlrd.rlr4:checked) .rlview .rlstbd > .rlpn.rlp0,
.rlmain:has(input.rlrd.rlr4:checked) .rlview .rlstbd > .rlpn.rlp1,
.rlmain:has(input.rlrd.rlr4:checked) .rlview .rlstbd > .rlpn.rlp2,
.rlmain:has(input.rlrd.rlr4:checked) .rlview .rlstbd > .rlpn.rlp3,
.rlmain:has(input.rlrd.rlr5:checked) .rlview .rlstbd > .rlpn.rlp0,
.rlmain:has(input.rlrd.rlr5:checked) .rlview .rlstbd > .rlpn.rlp1,
.rlmain:has(input.rlrd.rlr5:checked) .rlview .rlstbd > .rlpn.rlp2,
.rlmain:has(input.rlrd.rlr5:checked) .rlview .rlstbd > .rlpn.rlp3,
.rlmain:has(input.rlrd.rlr5:checked) .rlview .rlstbd > .rlpn.rlp4 {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 同步处理导航栏高亮：编号大的覆盖编号小的按钮高亮
   生效点：按钮背景 / 图标 i 的 background-color / 文字 span 的 color / 光条 ::after 的 transform:scaleX */
.rlmain:has(input.rlrd.rlr1:checked) .rlnavbar .rlb0,
.rlmain:has(input.rlrd.rlr2:checked) .rlnavbar :is(.rlb0, .rlb1),
.rlmain:has(input.rlrd.rlr3:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2),
.rlmain:has(input.rlrd.rlr4:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2, .rlb3),
.rlmain:has(input.rlrd.rlr5:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2, .rlb3, .rlb4) {
  background: linear-gradient(180deg, rgba(20, 26, 44, .96), rgba(10, 13, 22, .98)) !important;
}

.rlmain:has(input.rlrd.rlr1:checked) .rlnavbar .rlb0 i,
.rlmain:has(input.rlrd.rlr2:checked) .rlnavbar :is(.rlb0, .rlb1) i,
.rlmain:has(input.rlrd.rlr3:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2) i,
.rlmain:has(input.rlrd.rlr4:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2, .rlb3) i,
.rlmain:has(input.rlrd.rlr5:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2, .rlb3, .rlb4) i {
  background-color: var(--rl-txt3) !important;
  filter: none !important;
  transform: none !important;
  animation: none !important;
}

.rlmain:has(input.rlrd.rlr1:checked) .rlnavbar .rlb0 span,
.rlmain:has(input.rlrd.rlr2:checked) .rlnavbar :is(.rlb0, .rlb1) span,
.rlmain:has(input.rlrd.rlr3:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2) span,
.rlmain:has(input.rlrd.rlr4:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2, .rlb3) span,
.rlmain:has(input.rlrd.rlr5:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2, .rlb3, .rlb4) span {
  color: var(--rl-txt3) !important;
  font-weight: 600 !important;
  text-shadow: none !important;
}

.rlmain:has(input.rlrd.rlr1:checked) .rlnavbar .rlb0::after,
.rlmain:has(input.rlrd.rlr2:checked) .rlnavbar :is(.rlb0, .rlb1)::after,
.rlmain:has(input.rlrd.rlr3:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2)::after,
.rlmain:has(input.rlrd.rlr4:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2, .rlb3)::after,
.rlmain:has(input.rlrd.rlr5:checked) .rlnavbar :is(.rlb0, .rlb1, .rlb2, .rlb3, .rlb4)::after {
  transform: scaleX(0) !important;
}

/* ---------- 25-5 rili 平台页面美化（轮回乐园·秩序混沌双轴系） ----------
   - 底色：深空蓝黑 (#05070c / #080a10 / #0e1220)
   - 主色：秩序青 #4dd0ff (AI/输入栏/导航)
   - 副色：混沌红 #ff2d55 (玩家气泡)
   - 强调：金 #ffc94d (按钮/高亮)
   ----------------------------------------------- */

/* ─── 输入栏容器 ─── */
#prompt-input [data-slot="input-group"] {
  background: linear-gradient(135deg, #0e1220 0%, #080a10 100%) !important;
  border: 1px solid rgba(46, 63, 104, .6) !important;
  border-top: 3px solid #4dd0ff !important;
  border-radius: 8px !important;
  box-shadow: 0 -4px 16px rgba(5, 7, 12, .6), inset 0 0 60px rgba(77, 208, 255, .04), 0 -1px 0 rgba(77, 208, 255, .15) inset !important;
  position: relative !important;
  overflow: visible !important;
  transition: all 0.3s ease !important;
}
#prompt-input [data-slot="input-group"]::before {
  content: "" !important;
  position: absolute !important;
  top: -3px; left: 0; right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, transparent 0%, #4dd0ff 10%, #4dd0ff 30%, #ffc94d 50%, #4dd0ff 70%, #4dd0ff 90%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation: rlInputBorderFlow 4s linear infinite !important;
  opacity: 0.8 !important;
}
#prompt-input [data-slot="input-group"]:hover {
  box-shadow: 0 -6px 24px rgba(5, 7, 12, .75), inset 0 0 80px rgba(77, 208, 255, .06), 0 -1px 0 rgba(77, 208, 255, .25) inset !important;
  transform: translateY(-2px) !important;
}
#prompt-input [data-slot="input-group"]:focus-within {
  border-color: #4dd0ff !important;
  box-shadow: 0 -6px 28px rgba(77, 208, 255, .2), inset 0 0 100px rgba(77, 208, 255, .08), 0 0 0 2px rgba(77, 208, 255, .2) !important;
}

/* ─── 输入框文本 ─── */
#prompt-input textarea {
  background: #05070c !important;
  color: #c8d4e8 !important;
  border: none !important;
  font-family: 'LXGW WenKai', 'Noto Serif SC', 'Source Han Serif SC', 'STSong', 'SimSun', 'Georgia', serif !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  padding: 12px 16px !important;
  border-radius: 4px !important;
  transition: all 0.2s ease !important;
  box-shadow: inset 0 1px 3px rgba(5, 7, 12, .4) !important;
}
#prompt-input textarea:focus {
  background: #080a10 !important;
  outline: none !important;
  box-shadow: inset 0 1px 4px rgba(77, 208, 255, .12), 0 0 0 1px #4dd0ff inset !important;
}
#prompt-input textarea::placeholder {
  color: #4dd0ff !important;
  font-family: 'LXGW WenKai', 'Noto Serif SC', 'Source Han Serif SC', 'STSong', 'SimSun', 'Georgia', serif !important;
  font-style: italic !important;
  opacity: 0.6 !important;
}

/* ─── 发送按钮 ─── */
#prompt-input-footer button {
  background: linear-gradient(135deg, #4dd0ff 0%, #1d7fa8 100%) !important;
  color: #05070c !important;
  border: 1px solid #4dd0ff !important;
  border-radius: 6px !important;
  padding: 8px 16px !important;
  font-family: 'LXGW WenKai', 'Noto Serif SC', 'Source Han Serif SC', 'STSong', 'SimSun', 'Georgia', serif !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 8px rgba(77, 208, 255, .3), inset 0 1px 0 rgba(180, 230, 255, .25) !important;
  transition: all 0.2s ease !important;
  position: relative !important;
  overflow: hidden !important;
  text-shadow: 0 0 8px rgba(180, 230, 255, .5) !important;
}
#prompt-input-footer button::before {
  content: "" !important;
  position: absolute !important;
  top: -50%; left: -50% !important;
  width: 200%; height: 200% !important;
  background: radial-gradient(circle, rgba(77, 208, 255, .25) 0%, transparent 70%) !important;
  opacity: 0 !important;
  transition: opacity 0.4s ease !important;
}
#prompt-input-footer button:hover {
  background: linear-gradient(135deg, #4dd0ff 0%, #4dd0ff 100%) !important;
  box-shadow: 0 4px 14px rgba(77, 208, 255, .5), inset 0 1px 0 rgba(200, 240, 255, .35) !important;
  transform: translateY(-1px) scale(1.02) !important;
}
#prompt-input-footer button:hover::before {
  opacity: 1 !important;
  animation: rlButtonRipple 1.2s ease-out infinite !important;
}
#prompt-input-footer button:active {
  transform: translateY(0) scale(0.98) !important;
  box-shadow: 0 1px 4px rgba(77, 208, 255, .4), inset 0 2px 4px rgba(5, 7, 12, .3) !important;
}
#prompt-input-footer button svg {
  transition: transform 0.3s ease !important;
  filter: drop-shadow(0 1px 2px rgba(5, 7, 12, .4)) !important;
}
#prompt-input-footer button:hover svg {
  transform: translateX(2px) !important;
}

/* ─── 输入栏头部按钮 ─── */
#prompt-input-header button {
  background: #141a2c !important;
  color: #4dd0ff !important;
  border: 1px solid rgba(46, 63, 104, .6) !important;
  border-radius: 4px !important;
  padding: 6px 10px !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 1px 3px rgba(5, 7, 12, .3) !important;
}
#prompt-input-header button:hover {
  background: #1c2440 !important;
  color: #4dd0ff !important;
  border-color: #4dd0ff !important;
  box-shadow: 0 2px 6px rgba(77, 208, 255, .2), inset 0 0 0 1px rgba(77, 208, 255, .1) !important;
  transform: translateY(-1px) !important;
}
#prompt-input-header button svg { transition: all 0.3s ease !important; }
#prompt-input-header button:hover svg {
  transform: scale(1.1) !important;
  filter: drop-shadow(0 0 3px rgba(77, 208, 255, .5)) !important;
}

/* ─── AI 回复气泡（秩序青光弧·左） ─── */
.is-assistant > div {
  font-family: 'LXGW WenKai', 'Noto Serif SC', 'Source Han Serif SC', 'STSong', 'SimSun', 'Georgia', serif !important;
  position: relative !important;
  background: linear-gradient(135deg, rgba(77, 208, 255, .08) 0%, rgba(77, 208, 255, .04) 25%, rgba(20, 26, 44, .5) 50%, rgba(77, 208, 255, .04) 75%, rgba(77, 208, 255, .08) 100%), linear-gradient(180deg, rgba(14, 18, 32, .92) 0%, rgba(8, 10, 16, .88) 50%, rgba(5, 7, 12, .92) 100%) !important;
  border: 1px solid rgba(77, 208, 255, .25) !important;
  border-left: 2px solid rgba(77, 208, 255, .4) !important;
  box-shadow: 0 2px 12px rgba(5, 7, 12, .4), inset 0 0 60px rgba(77, 208, 255, .04), 0 1px 0 rgba(77, 208, 255, .1) inset !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  color: #c8d4e8 !important;
}
.is-assistant > div::before {
  content: "" !important;
  position: absolute !important;
  top: 0; left: -3px; bottom: 0 !important;
  width: 3px !important;
  background: linear-gradient(180deg, transparent 0%, #4dd0ff 10%, #4dd0ff 30%, #ffc94d 50%, #4dd0ff 70%, #4dd0ff 90%, transparent 100%) !important;
  background-size: 100% 200% !important;
  animation: rlAssistantBorderFlow 4s linear infinite !important;
  opacity: 0.8 !important;
  filter: drop-shadow(0 0 4px rgba(77, 208, 255, .6)) !important;
}
.is-assistant > div:hover {
  transform: none !important;
  box-shadow: 0 6px 24px rgba(5, 7, 12, .65), inset 0 0 80px rgba(77, 208, 255, .05), 0 1px 0 rgba(77, 208, 255, .2) inset !important;
}

/* ─── 玩家消息气泡（混沌红光弧·右） ─── */
.is-user > div {
  font-family: 'LXGW WenKai', 'Noto Serif SC', 'Source Han Serif SC', 'STSong', 'SimSun', 'Georgia', serif !important;
  position: relative !important;
  background: linear-gradient(135deg, rgba(77, 208, 255, .08) 0%, rgba(77, 208, 255, .04) 25%, rgba(28, 36, 64, .5) 50%, rgba(77, 208, 255, .04) 75%, rgba(77, 208, 255, .08) 100%), linear-gradient(180deg, rgba(20, 26, 44, .92) 0%, rgba(14, 18, 32, .88) 50%, rgba(8, 10, 16, .92) 100%) !important;
  border: 1px solid rgba(77, 208, 255, .25) !important;
  border-right: 2px solid rgba(77, 208, 255, .35) !important;
  box-shadow: 0 2px 12px rgba(5, 7, 12, .4), inset 0 0 60px rgba(77, 208, 255, .04),0 1px 0 rgba(77, 208, 255, .1) inset !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  color: #c8d4e8 !important;
}
.is-user > div::before {
  content: "" !important;
  position: absolute !important;
  top: 0; right: -3px; bottom: 0 !important;
  width: 3px !important;
  background: linear-gradient(180deg, transparent 0%, #4dd0ff 10%, #4dd0ff 30%, #ffc94d 50%, #4dd0ff 70%, #4dd0ff 90%, transparent 100%) !important;
  background-size: 100% 200% !important;
  animation: rlUserBorderFlow 4s linear infinite !important;
  opacity: 0.7 !important;
  filter: drop-shadow(0 0 4px rgba(77, 208, 255, .5)) !important;
}
.is-user > div:hover {
  transform: none !important;
  box-shadow: 0 6px 24px rgba(5, 7, 12, .65), inset 0 0 80px rgba(77, 208, 255, .05), 0 1px 0 rgba(77, 208, 255, .2) inset !important;
}

/* ─── 顶部导航栏 ─── */
nav header {
  height: 2rem !important;
  min-height: 2rem !important;
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
  background: linear-gradient(180deg, rgba(8, 12, 20, 0.97) 0%, rgba(4, 8, 16, 0.93) 100%) !important;
  backdrop-filter: blur(12px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
}
nav header::before {
  content: "" !important;
  position: absolute !important;
  bottom: -2px; left: 0; right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent 0%, rgba(77, 208, 255, 0.6) 15%, #4dd0ff 35%, #ffc94d 50%, #4dd0ff 65%, rgba(77, 208, 255, 0.6) 85%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation: rlHeaderBorderFlow 4s linear infinite !important;
  opacity: 0.9 !important;
  filter: blur(0.5px) !important;
}
nav header:hover {
  box-shadow:
    inset 0 1px 0 rgba(77, 208, 255, 0.14),
    inset 0 0 60px rgba(77, 208, 255, 0.06),
    0 4px 20px rgba(0, 0, 0, 0.7),
    0 0 16px rgba(77, 208, 255, 0.08) !important;
}

/* ─── 圆形操作按钮（复制/重试等） ─── */
.is-assistant button.rounded-full,
.is-user button.rounded-full {
  background: #141a2c !important;
  color: #4dd0ff !important;
  border: 1px solid rgba(46, 63, 104, .6) !important;
  border-radius: 50% !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 1px 3px rgba(5, 7, 12, .3) !important;
  position: relative !important;
  overflow: hidden !important;
}
.is-assistant button.rounded-full::before,
.is-user button.rounded-full::before {
  content: "" !important;
  position: absolute !important;
  top: -50%; left: -50% !important;
  width: 200%; height: 200% !important;
  background: radial-gradient(circle, rgba(77, 208, 255, .2) 0%, transparent 70%) !important;
  opacity: 0 !important;
  transition: opacity 0.4s ease !important;
}
.is-assistant button.rounded-full:hover,
.is-user button.rounded-full:hover {
  background: #1c2440 !important;
  color: #4dd0ff !important;
  border-color: #4dd0ff !important;
  box-shadow: 0 2px 6px rgba(77, 208, 255, .2), inset 0 0 0 1px rgba(77, 208, 255, .1) !important;
  transform: translateY(-1px) scale(1.05) !important;
}
.is-assistant button.rounded-full:hover::before,
.is-user button.rounded-full:hover::before {
  opacity: 1 !important;
  animation: rlButtonRipple 1.2s ease-out infinite !important;
}
.is-assistant button.rounded-full:active,
.is-user button.rounded-full:active {
  transform: translateY(0) scale(0.95) !important;
  box-shadow: 0 1px 3px rgba(77, 208, 255, .25), inset 0 2px 4px rgba(5, 7, 12, .3) !important;
}
.is-assistant button.rounded-full svg,
.is-user button.rounded-full svg { transition: all 0.3s ease !important; }
.is-assistant button.rounded-full:hover svg,
.is-user button.rounded-full:hover svg {
  transform: scale(1.1) !important;
  filter: drop-shadow(0 0 3px rgba(77, 208, 255, .5)) !important;
}

/* ─── 动画关键帧 ─── */
@keyframes rlInputBorderFlow { 0% { background-position: 0% 0%; } 100% { background-position: 200% 0%; } }
@keyframes rlAssistantBorderFlow { 0% { background-position: 0% 0%; } 100% { background-position: 0% 200%; } }
@keyframes rlUserBorderFlow { 0% { background-position: 0% 0%; } 100% { background-position: 0% 200%; } }
@keyframes rlHeaderBorderFlow { 0% { background-position: 0% 0%; } 100% { background-position: 200% 0%; } }
@keyframes rlButtonRipple { 0% { transform: translate(-50%, -50%) scale(0); opacity: 1; } 100% { transform: translate(-50%, -50%) scale(1.5); opacity: 0; } }

/* ---------- 25-6 rili 平台渲染器补充美化 ----------
   代码块 / 引用块 / 滚动条 / 行动选项按钮兜底。 */

/* ─── 代码块（终端风·秩序青边） ─── */
.rili-markdown-renderer pre {
  background: #05070c !important;
  border: 1px solid rgba(46, 63, 104, .6) !important;
  border-left: 3px solid #4dd0ff !important;
  border-radius: 4px !important;
  padding: 12px 16px !important;
  margin: 8px 0 !important;
  font-family: 'Cascadia Code', 'Consolas', 'Source Code Pro', 'Menlo', 'Courier New', monospace !important;
  font-size: 0.88em !important;
  line-height: 1.6 !important;
  color: #4dd0ff !important;
  overflow-x: auto !important;
  box-shadow: inset 0 0 30px rgba(77, 208, 255, .04), 0 1px 4px rgba(5, 7, 12, .4) !important;
}
.rili-markdown-renderer pre code {
  background: transparent !important;
  color: #4dd0ff !important;
  padding: 0 !important;
  font-family: inherit !important;
  text-shadow: 0 0 6px rgba(77, 208, 255, .25) !important;
}
.rili-markdown-renderer code {
  background: rgba(77, 208, 255, .12) !important;
  color: #4dd0ff !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
  font-family: 'Cascadia Code', 'Consolas', 'Source Code Pro', 'Menlo', 'Courier New', monospace !important;
  font-size: 0.9em !important;
  border: 1px solid rgba(77, 208, 255, .25) !important;
}

/* ─── 引用块（混沌红光弧·左） ─── */
.rili-markdown-renderer blockquote {
  background: linear-gradient(135deg, rgba(255, 45, 85, .1) 0%, rgba(255, 45, 85, .06) 100%) !important;
  border-left: 4px solid #ff2d55 !important;
  padding: 10px 16px !important;
  margin: 8px 0 !important;
  color: #ffc94d !important;
  font-style: italic !important;
  border-radius: 0 4px 4px 0 !important;
  box-shadow: 0 1px 4px rgba(255, 45, 85, .15), inset 0 0 30px rgba(255, 45, 85, .03) !important;
  position: relative !important;
}
.rili-markdown-renderer blockquote::before {
  content: "" !important;
  position: absolute !important;
  top: 0; bottom: 0; left: -4px !important;
  width: 4px !important;
  background: linear-gradient(180deg, transparent 0%, #ff2d55 15%, #ffc94d 50%, #ff2d55 85%, transparent 100%) !important;
  background-size: 100% 200% !important;
  animation: rlUserBorderFlow 4s linear infinite !important;
  opacity: 0.8 !important;
}

/* ─── 渲染器滚动条（秩序青主题） ─── */
.rili-markdown-renderer ::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}
.rili-markdown-renderer ::-webkit-scrollbar-track {
  background: #05070c !important;
  border-radius: 4px !important;
}
.rili-markdown-renderer ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(77, 208, 255, .7), rgba(46, 63, 104, .7)) !important;
  border-radius: 4px !important;
  border: 1px solid rgba(77, 208, 255, .3) !important;
}
.rili-markdown-renderer ::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(77, 208, 255, .85), rgba(77, 208, 255, .5)) !important;
  box-shadow: 0 0 8px rgba(77, 208, 255, .5) !important;
}

/* ─── 行动选项按钮（shell 外防御样式） ─── */
.rili-markdown-renderer [data-action="append-textinput"] {
  display: block !important;
  padding: 10px 14px !important;
  margin: 6px 0 !important;
  background: linear-gradient(155deg, rgba(14, 18, 32, .92), rgba(8, 10, 16, .94)) !important;
  border: 1px solid rgba(77, 208, 255, .35) !important;
  border-left: 3px solid #4dd0ff !important;
  border-radius: 6px !important;
  color: #4dd0ff !important;
  font-family: 'LXGW WenKai', 'Noto Serif SC', 'Source Han Serif SC', 'STSong', 'SimSun', 'Georgia', serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  word-break: break-word !important;
  box-shadow: 0 2px 8px rgba(5, 7, 12, .3), inset 0 1px 0 rgba(77, 208, 255, .08) !important;
}
.rili-markdown-renderer [data-action="append-textinput"]:hover {
  transform: translateX(3px) !important;
  border-color: #4dd0ff !important;
  border-left-color: #4dd0ff !important;
  box-shadow: 0 4px 14px rgba(77, 208, 255, .35), inset 0 1px 0 rgba(180, 230, 255, .15), 0 0 18px -4px rgba(77, 208, 255, .5) !important;
  background: linear-gradient(155deg, rgba(20, 26, 44, .96), rgba(14, 18, 32, .96)) !important;
  color: #ffc94d !important;
}
.rili-markdown-renderer [data-action="append-textinput"]:active {
  transform: translateX(1px) scale(0.98) !important;
  box-shadow: 0 1px 4px rgba(77, 208, 255, .3), inset 0 2px 4px rgba(5, 7, 12, .4) !important;
}

/* ============================================================
   26. rlsec 标签页互斥 · radio版
   互斥由17节radio:checked链实现（平台剥离details的name属性，
   但input的name正常），无需焦点兜底与多开标题条
   ============================================================ */

@container rlbox (max-width: 460px) {
  .rlmain .rlbtn span {
    font-size: 9px;
    letter-spacing: 0;
  }.rlmain .rlbtn i {
    width: 22px;
    height: 22px;
    -webkit-mask-size: 22px 22px;
    mask-size: 22px 22px;
  }
  .rlmain .rlslot {
    padding: 0 9px;
  }
  .rlmain .rlslot > u > s {
    display: none;
  }
  .rlmain .rlnavbar {
    height: 66px;
  }
  .rlmain .rlactbd {
    max-height: 304px;overflow-y: auto;
  }
  .rlmain .rlaci > span {
    font-size: 11.5px;
    line-height: 1.55;
  }
  .rlmain .rlsthd {
    height: 40px;
    padding-left: 11px;
  }
  .rlmain .rlstclose::after {
    display: none;
  }
  .rlmain .rlstclose {
    width: 30px;
    padding: 0;
    justify-content: center;
  }
}

header.flex.h-12.items-center.justify-between.gap-2.border-b.px-4.transition-\[width\,height\].ease-linear.md\:h-16 {
  position: relative !important;
  height: 2rem !important;
  min-height: 2rem !important;
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
  background: linear-gradient(180deg, rgba(8, 12, 20, 0.97) 0%, rgba(4, 8, 16, 0.93) 100%) !important;
  border-bottom: none !important;
  border-left: 1px solid rgba(77, 208, 255, 0.18) !important;
  border-right: 1px solid rgba(77, 208, 255, 0.18) !important;
  border-radius: 0 0 3px 3px !important;
  box-shadow:
    inset 0 1px 0 rgba(77, 208, 255, 0.08),
    inset 0 0 40px rgba(77, 208, 255, 0.04),
    0 2px 12px rgba(0, 0, 0, 0.6) !important;
  backdrop-filter: blur(12px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
  color: rgba(200, 230, 255, 0.92) !important;
  text-shadow: 0 0 8px rgba(77, 208, 255, 0.3) !important;
  transition: box-shadow 0.3s ease, border-color 0.3s ease, background 0.3s ease !important;
}

header.flex.h-12.items-center.justify-between.gap-2.border-b.px-4.transition-\[width\,height\].ease-linear.md\:h-16::before {
  content: "" !important;
  position: absolute !important;
  bottom: -2px; left: 0; right: 0!important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent0%, rgba(77, 208, 255, 0.6) 15%, #4dd0ff 35%, #ffc94d 50%, #4dd0ff 65%, rgba(77, 208, 255, 0.6) 85%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation:rlHeaderBorderFlow 4s linear infinite !important;
  opacity: 0.9 !important;
  filter: blur(0.5px) !important;
}

header.flex.h-12.items-center.justify-between.gap-2.border-b.px-4.transition-\[width\,height\].ease-linear.md\:h-16:hover {
  background: linear-gradient(180deg, rgba(10, 16, 28, 0.98) 0%, rgba(6, 10, 20, 0.95) 100%) !important;
  border-left-color: rgba(77, 208, 255, 0.32) !important;
  border-right-color: rgba(77, 208, 255, 0.32) !important;
  box-shadow:
    inset 0 1px 0 rgba(77, 208, 255, 0.14),
    inset 0 0 60px rgba(77, 208, 255, 0.06),
    0 4px 20px rgba(0, 0, 0, 0.7),
    0 0 16px rgba(77, 208, 255, 0.08) !important;
  color: rgba(220, 240, 255, 1) !important;
  text-shadow: 0 0 10px rgba(77, 208, 255, 0.4) !important;
}

.is-assistant > div::after {
  content: "" !important;
  position: absolute !important;
  bottom: -1px; left: 10%; right: 10% !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent0%, #4dd0ff 20%, #4dd0ff 40%, #ffc94d 50%, #4dd0ff 60%, #4dd0ff 80%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation: rlHeaderBorderFlow 4s linear infinite !important;
  opacity: 0.5 !important;
  border-radius: 1px !important;
}

.is-assistant > div::after {
  content: "" !important;
  position: absolute !important;
  bottom:0; left: 0; right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent 0%, #4dd0ff 20%, #4dd0ff 40%, #ffc94d 50%, #4dd0ff 60%, #4dd0ff 80%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation: rlHeaderBorderFlow 4s linear infinite !important;
  opacity: 0.6 !important;
}

.is-user > div::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent 0%, #4dd0ff 20%, #4dd0ff 40%, #ffc94d 50%, #4dd0ff 60%, #4dd0ff 80%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation: rlHeaderBorderFlow 4s linear infinite !important;
  opacity: 0.5 !important;
}

.is-assistant > div::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent 0%, #4dd0ff 20%, #4dd0ff 40%, #ffc94d 50%, #4dd0ff 60%, #4dd0ff 80%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation: rlHeaderBorderFlow 4s linear infinite !important;
  opacity: 0.6 !important;
}

.is-user > div::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent 0%, #ff2d55 20%, #ff2d55 40%, #ffc94d 50%, #ff2d55 60%, #ff2d55 80%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation: rlHeaderBorderFlow 4s linear infinite !important;
  opacity: 0.5 !important;
}



div#nav-middle.flex.min-w-0.flex-1.h-full.items-center.justify-center.gap-2.overflow-hidden:hover {
  border-left-color: rgba(77, 208, 255, 0.25) !important;
  border-right-color: rgba(77, 208, 255, 0.25) !important;
  box-shadow: inset 0 0 50px rgba(77, 208, 255, 0.05), 0 0 10px rgba(77, 208, 255, 0.08) !important;
  color: rgba(77, 208, 255, 1) !important;
  text-shadow: 0 0 8px rgba(77, 208, 255, 0.35) !important;
}

div#nav-middle.flex.min-w-0.flex-1.h-full.items-center.justify-center.gap-2.overflow-hidden::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0; left: 0; right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, rgba(77, 208, 255, 0.4) 30%, rgba(255, 201, 77, 0.5) 50%, rgba(77, 208, 255, 0.4) 70%, transparent 100%) !important;
  background-size: 200% 100% !important;
  animation:rlHeaderBorderFlow 4s linear infinite !important;
  opacity: 0.7 !important;
}

.rlmain {
  height: calc(100vh - 210px) !important;
  max-height: 780px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.rlmain .rlview {
  min-height: 0 !important;
}

.rlmain .rlbody {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}

@media (max-width: 520px) {
  .rlmain {
    height: calc(100vh - 250px) !important;
    max-height: calc(100vh - 250px) !important;
    width: calc(100% + 12px) !important;
    margin-left: -12px !important;
  }
}

/* ============================================================
   27. 手机端降耗层 —— 关闭高成本特效，保留布局与交互
   无限动画/backdrop-filter/blur滤镜是手机GPU持续重绘三大来源；
   transition:all会连带布局属性引发反复重排，收窄为颜色类过渡。
   ============================================================ */
@media (max-width: 520px) {

  /* 27-1 停掉全部循环动画（流光/呼吸/漂移/慢速旋转均为纯装饰） */
  .rlmain *,
  .rlmain *::before,
  .rlmain *::after,
  .is-assistant *,
  .is-user *,
  nav header,
  nav header::before {
    animation: none !important;
  }

  /* 27-2 去掉模糊与滤镜（backdrop-filter在手机上开销最大） */
  .rlmain,
  .rlmain *,
  .is-assistant > div,
  .is-user > div,
  nav header {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    filter: none !important;
  }

  /* 27-3 transition:all收窄为颜色/透明度，避免布局属性重排 */
  .rlmain * {
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, opacity .2s ease !important;
  }
}