/* ==========================================================================
   霓虹深渊主题：巨型自定义加载界面 (包含指定图片、伪进度条与游玩提示)
   ========================================================================== */

/* 1. 强制隐藏平台默认的无聊闪烁小圆点 */
.style-module__AtdJSq__dot-flashing.style-module__AtdJSq__text {
    display: none !important;
}

/* 2. 重塑加载元素的父容器：将其撑开为一个巨大的画布 */
.flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
    width: 100% !important;
    min-width: 300px !important;
    height: 420px !important; /* 分配足够的高度容纳巨幅图片和底部进度条 */
    background: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    margin: 20px 0 !important;
}

/* 3. 上半部分 (::before)：居中展示您指定的巨幅图片 */
.flex.items-center.justify-center.w-6.h-5::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 260px !important; /* 为图片保留的高度 */
    /* 强力插入您指定的图片URL */
    background-image: url('https://catai.wiki/b21b8f42-cb02-4520-6f8f-2656687e7700/w=3000') !important;
    background-size: contain !important; /* 确保图片完整显示不被裁剪 */
    background-position: center bottom !important;
    background-repeat: no-repeat !important;
    z-index: 1 !important;
    /* 添加轻微的呼吸律动感 */
    animation: neon-pulse-img 2s infinite alternate ease-in-out !important;
    filter: drop-shadow(0px 5px 10px rgba(0,0,0,0.1)) !important;
}

@keyframes neon-pulse-img {
    0% { transform: scale(0.98); opacity: 0.9; }
    100% { transform: scale(1); opacity: 1; }
}

/* 4. 下半部分 (::after)：内嵌SVG实现高能提示框与霓虹伪进度条动画 */
.flex.items-center.justify-center.w-6.h-5::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 150px !important; /* 为提示文字和进度条保留的高度 */
    z-index: 2 !important;
    background-repeat: no-repeat !important;
    background-position: center bottom !important;
    background-size: 100% 100% !important;
    /* 
       将复杂的排版和SMIL动画封装在Data URI中。
       包含：虚线边框信息牌、警告文字、深色轨道、霓虹渐变进度条(SMIL控制width) 
    */
    background-image: url("data:image/svg+xml;utf8,<svg width='100%' height='150' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='g' x1='0%' y1='0%' x2='100%' y2='0%'><stop offset='0%' stop-color='%23FF1493' /><stop offset='50%' stop-color='%23FFE135' /><stop offset='100%' stop-color='%2305d9e8' /></linearGradient></defs><rect x='2%' y='5' width='96%' height='65' fill='%23fffdf0' rx='4' stroke='%23111' stroke-width='2' stroke-dasharray='4 4'/><rect x='2%' y='5' width='6' height='65' fill='%23FF1493' rx='2'/><text x='50%' y='28' font-family='sans-serif' font-size='14' fill='%23111' text-anchor='middle' font-weight='bold'> ⚠️建议 <tspan fill='%23FF1493' font-size='16'>2-4</tspan> 记忆游玩，下方快捷键按需使用</text><text x='50%' y='52' font-family='sans-serif' font-size='13' fill='%23666' text-anchor='middle'>若遇截断请开 <tspan fill='%2305d9e8' font-weight='bold'>非流</tspan> 或切换至 <tspan fill='%2305d9e8' font-weight='bold'>DeepSeek</tspan> 模型</text><rect x='10%' y='90' width='80%' height='20' fill='%23222' rx='10' stroke='%23111' stroke-width='3'/><rect x='10%' y='90' width='0' height='20' fill='url(%23g)' rx='10'><animate attributeName='width' values='0; 80%; 80%' keyTimes='0; 0.8; 1' dur='3.5s' repeatCount='indefinite' /></rect><text x='50%' y='135' font-family='sans-serif' font-size='16' fill='%23111' text-anchor='middle' font-weight='900' letter-spacing='3'>SCENE LOADING...<animate attributeName='opacity' values='1;0.3;1' dur='1.5s' repeatCount='indefinite'/></text></svg>") !important;
}

/* 5. 移动端小屏幕微调适配 */
@media (max-width: 480px) {
    .flex.items-center.justify-center.w-6.h-5 {
        height: 380px !important;
    }
    .flex.items-center.justify-center.w-6.h-5::before {
        height: 220px !important;
    }
}

ai {
  display: block;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #111;
  background-color: #fdfbf7;
  background-image: radial-gradient(#d5d5d5 1px, transparent 1px);
  background-size: 10px 10px;
  padding: 10px;
  box-sizing: border-box;
  --pop-y: #FFE135;
  --pop-p: #FF1493;
  --pop-c: #05d9e8;
  --pop-g: #39ff14;
  --border: 2px solid #111;
  --shadow: 3px 3px 0px #111;
}

/* 基础剪报面板样式 */
ai details {
  background: #fff;
  border: var(--border);
  box-shadow: var(--shadow);
  margin-bottom: 15px;
  padding-bottom: 8px;
  position: relative;
  overflow: hidden;
}

ai summary {
  font-weight: bold;
  font-size: 15px;
  padding: 8px 10px;
  cursor: pointer;
  border-bottom: var(--border);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  list-style: none;
}
ai summary::-webkit-details-marker { display: none; }

/* 引擎调度 - 胶带打板器 */
ai .mode summary { background: var(--pop-y); }
ai .mode d { padding: 5px 10px; display: block; }

/* 新闻动态 - 八卦杂志风 */
ai .nw { transform: rotate(-1deg); width: 98%; margin: 10px auto 15px;}
ai .nw summary { background: var(--pop-p); color: #fff; text-shadow: 1px 1px 0 #111; }
ai .nw d {
  display: block; margin: 6px 10px; padding: 6px;
  background: #f4f4f4; border: 1px dashed #666;
  border-left: 4px solid var(--pop-p);
}

/* 场记板 - 核心黑白条纹 */
ai .env { border: 3px solid #111; border-radius: 4px; }
ai .env summary {
  background: repeating-linear-gradient(
    45deg, #111, #111 10px, #fff 10px, #fff 20px
  );
  color: #fff; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
  text-align: center; font-size: 16px;
}
ai .env g { background: #222; padding: 8px; }
ai .env d { color: #111; } /* 修复白底白字问题，强制设为黑字 */

/* 正文 - 剧本台词本风格 */
ai txt {
  display: block; margin: 15px 0; padding: 15px;
  background: #fff; border: 1px solid #ddd;
  border-left: 4px solid var(--pop-c);
  box-shadow: 2px 2px 5px rgba(0,0,0,0.05);
  font-size: 15px; line-height: 1.7; text-align: justify;
}
ai txt::first-letter {
  font-size: 1.5em; font-weight: bold; color: var(--pop-p);
  float: left; margin-right: 4px; line-height: 1;
}

/* 女优与NPC档案 - 明星卡片/内幕档案 */
ai .p1 summary { background: linear-gradient(90deg, var(--pop-c), var(--pop-y)); }
ai .p2 summary { background: linear-gradient(90deg, #ff6b6b, #feca57); }

/* 通用网格布局与数据项 */
ai g { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px; }
ai d { 
  background: #f9f9f9; border: 1px solid #ccc; 
  padding: 2px 6px; font-size: 13px; border-radius: 2px;
}
ai d.fw { width: 100%; background: transparent; border: none; border-bottom: 1px solid #eee; }

/* 内部区块 - 胶带贴纸效果 */
ai .bx {
  margin: 10px; padding: 12px 10px 8px;
  background: #fffdf0; border: 2px dashed #bbb;
  position: relative;
}
ai .bx::before {
  content: ""; position: absolute; top: -8px; left: 50%;
  transform: translateX(-50%) rotate(-2deg);
  width: 60px; height: 16px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(0,0,0,0.1);
  box-shadow: 0 1px 2px rgba(0,0,0,0.1);
  backdrop-filter: blur(2px); z-index: 1;
}
ai .bx b:first-child { display: block; margin-bottom: 6px; color: var(--pop-p); }

/* 列表美化 - 金币与摄影机 */
ai li {
  list-style: none; margin-bottom: 4px; padding-left: 20px;
  position: relative; font-size: 13px; border-bottom: 1px dotted #ccc;
}
ai .p1 .bx:nth-of-type(1) li::before { content: "📸"; position: absolute; left: 0; top: 0; }
ai .p1 .bx:nth-of-type(2) li::before { content: "💴"; position: absolute; left: 0; top: 0; }
ai .p2 .bx li::before { content: "⚠️"; position: absolute; left: 0; top: 0; }

/* 字段高亮 - 荧光笔效果 */
ai f {
  font-weight: bold; margin-right: 4px;
  background: linear-gradient(180deg, transparent 50%, var(--pop-y) 50%);
  padding: 0 2px;
}
ai .p2 f { background: linear-gradient(180deg, transparent 50%, #ffcccb 50%); }

/* 记忆区 - 拍立得/手账本 */
ai .mem summary { background: #ccc; }
ai mr { display: block; font-size: 12px; color: #666; padding: 8px 10px; background: #eee; }
ai .sm { margin: 8px; border: 1px solid #111; box-shadow: 2px 2px 0 #111; }
ai .sm summary { background: #fff; font-size: 13px; border-bottom: none; }
ai .sm p { margin: 0; padding: 8px; background: #fafafa; border-top: 1px dashed #111; font-size: 13px;}

/* 行动推荐 - 票根选项 */
ai .act summary { background: var(--pop-g); }
ai .act ol { padding: 0 10px 10px 10px; margin: 10px 0 0 0; }
ai .act li {
  background: #fff; border: 2px solid #111; box-shadow: 2px 2px 0 #111;
  margin-bottom: 8px; padding: 6px 10px 6px 30px;
  cursor: pointer; transition: all 0.2s;
  border-radius: 0 8px 8px 0; border-left: 6px dashed #111;
}
ai .act li::before { content: "🎫"; left: 6px; top: 6px; }
ai .act li:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--pop-p); }