/* ============================================================
   xiuren100 附加样式
   原则：桌面端完全沿用目标站模板（宽度 1200 / 字体 / 配色都不动），
         这里只做三件事：①移动端自适应 ②顶部导航+搜索框 ③图片放大
   ============================================================ */

/* ---------- 顶部：导航 + 搜索框（桌面端也保持原模板观感） ---------- */
#head{display:flex;align-items:center;gap:14px}
#logo{margin:0;line-height:1}
#navhome ul{display:flex;gap:2px;list-style:none;margin:0;padding:0;align-items:center}
#navhome>ul>li{position:relative}
#navhome>ul>li>a,#navhome>ul>li>span{display:block;padding:9px 13px;border-radius:4px}
#navhome>ul>li>a:hover,#navhome>ul>li>span:hover,#navhome>ul>li:hover>a,#navhome>ul>li:hover>span{background:#f2f2f2}
#navhome .nav-multi>ul{display:none;position:absolute;left:0;top:100%;z-index:99;background:#fff;
  border:1px solid #e6e6e6;box-shadow:0 6px 20px rgba(0,0,0,.08);padding:8px;min-width:150px;
  max-height:420px;overflow-y:auto;grid-template-columns:repeat(3,minmax(120px,1fr));gap:2px 6px}
#navhome .nav-multi:hover>ul{display:grid}
#navhome .nav-multi>ul>li>a{display:block;padding:7px 10px;white-space:nowrap;border-radius:4px}
#navhome .nav-multi>ul>li>a:hover{background:#f5f5f5}
#topsearch{margin-left:auto;display:flex}
#topsearch input{padding:8px 12px;border:1px solid #ddd;border-right:0;font-size:14px;width:220px;outline:none}
#topsearch button{padding:8px 16px;border:0;background:#0cc215;color:#fff;cursor:pointer;font-size:14px}

/* ---------- 内容页：上一套/下一套 + 相关推荐（不动原排版） ---------- */
#thread-pic .adw li a{display:block}
.prevnext{display:flex;gap:16px;justify-content:space-between;padding:8px 0 22px;flex-wrap:wrap}
.related{border-top:1px solid #eee;margin-top:10px;padding-top:14px}
.related h3{font-size:17px;margin:0 0 12px}

/* ---------- 图片放大 ---------- */
#lb{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:9999;display:none;
  align-items:center;justify-content:center;flex-direction:column}
#lb.on{display:flex}
#lb img{max-width:94vw;max-height:86vh;object-fit:contain}
#lb .bar{position:absolute;top:16px;right:20px;display:flex;gap:14px;color:#fff}
#lb .bar a{color:#fff;cursor:pointer;text-decoration:none}
#lb .nav{position:absolute;top:50%;transform:translateY(-50%);font-size:40px;color:#fff;
  cursor:pointer;padding:10px 18px;user-select:none;opacity:.7}
#lb .nav:hover{opacity:1}
#lb .prev{left:10px}
#lb .next{right:10px}

/* ============================================================
   移动端自适应（覆盖原模板的固定 1200px 与 body 最小宽度）
   ============================================================ */
html,body{min-width:0 !important;overflow-x:hidden}
img{max-width:100%;height:auto}
@media (max-width:1280px){
  #wp,.wp,body#nv_home .wp{width:auto !important;max-width:1200px;margin:0 auto;padding:0 12px;box-sizing:border-box}
  #head{max-width:1200px;margin:0 auto;padding:10px 12px;box-sizing:border-box}
}
@media (max-width:1024px){
  .loop_pic .group{width:25%}
  #topsearch input{width:170px}
}
@media (max-width:768px){
  #head{flex-wrap:wrap;gap:8px}
  #logo img{max-height:38px;width:auto}
  #navhome{order:3;width:100%;overflow-x:auto}
  #navhome>ul{flex-wrap:nowrap;white-space:nowrap}
  #navhome>ul>li>a,#navhome>ul>li>span{padding:8px 10px;font-size:14px}
  #navhome .nav-multi>ul{position:static;display:grid;grid-template-columns:repeat(3,1fr);gap:2px;
    max-height:none;overflow:visible;box-shadow:none;border:0;padding:4px 0 4px 8px}
  #topsearch{order:2;margin-left:0;width:100%}
  #topsearch input{width:100%;flex:1;min-width:0}
  .loop_pic .group{width:50%;padding:0 5px;margin-bottom:14px}
  .pg a,.pg strong{min-width:32px;height:32px;line-height:32px;font-size:13px;padding:0 8px}
  #thread-title h1{font-size:17px;line-height:1.4}
}
@media (max-width:420px){
  #navhome .nav-multi>ul{grid-template-columns:repeat(2,1fr)}
}

/* ---------- 容器宽度/居中：与目标站一致（1330px 居中） ---------- */
html{overflow-x:hidden}
body>.wp,#wp,.wp,body#nv_home .wp{width:1330px;max-width:100%;margin:0 auto;box-sizing:border-box}
.loop_pic,#index-pic{width:auto}

/* ---------- 内容页：去掉列表小黑点 + 头部排版 ---------- */
#thread-pic .adw{list-style:none !important;margin:0;padding:0}
#thread-pic .adw li{list-style:none !important;margin:0 0 10px;padding:0;background:none}
#thread-pic .adw li:before,#thread-pic .adw li:after{content:none !important;display:none !important}
#thread-title #title{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 10px}
#thread-title #title h1{width:100%;font-size:20px;line-height:1.5;margin:0 0 8px;font-weight:400;color:#111}
#thread-title #title a{font-size:13px;color:#0cc215}
#thread-title #title em{font-size:12px;color:#999;font-style:normal}

/* 导航悬停文字可见（原模板 hover 是白字，配浅色底就看不见了） */
#navhome>ul>li>a,#navhome>ul>li>span{color:#333 !important}
#navhome>ul>li>a:hover,#navhome>ul>li>span:hover,
#navhome>ul>li:hover>a,#navhome>ul>li:hover>span{color:#111 !important;background:#f2f2f2 !important}
#navhome .nav-multi>ul>li>a{color:#555 !important}
#navhome .nav-multi>ul>li>a:hover{color:#111 !important;background:#f5f5f5 !important}

/* 分页与页脚错位修复：清浮动 + 各自居中独占一行 */
#index-page,#thread-page{clear:both;width:100%;display:block;overflow:hidden;padding:10px 0 4px}
#index-page .pg,#thread-page .pg{float:none;display:flex;justify-content:center;flex-wrap:wrap;width:100%;margin:0 auto}
#ft,#footer,.footer{clear:both;width:100%;display:block}
#ft{max-width:1330px;margin:0 auto;padding:18px 12px 30px;text-align:center;box-sizing:border-box}

/* 导航：深底白字（修正上一版改错的颜色） */
#navhome{background:transparent}
#navhome>ul>li>a,#navhome>ul>li>span{color:#fff !important;font-weight:500}
#navhome>ul>li>a:hover,#navhome>ul>li>span:hover,
#navhome>ul>li:hover>a,#navhome>ul>li:hover>span{color:#fff !important;background:rgba(255,255,255,.16) !important}
#navhome .nav-multi>ul{background:#fff}
#navhome .nav-multi>ul>li>a{color:#444 !important}
#navhome .nav-multi>ul>li>a:hover{color:#111 !important;background:#f5f5f5 !important}

/* 导航条：深底白字，保证清晰可见 */
#head{background:#1b1b1b}
#navhome{background:#1b1b1b;padding:0 6px;border-radius:4px}
#navhome>ul>li>a,#navhome>ul>li>span{color:#fff !important;font-weight:500;font-size:15px}
#navhome>ul>li>a:hover,#navhome>ul>li>span:hover,
#navhome>ul>li:hover>a,#navhome>ul>li:hover>span{color:#fff !important;background:rgba(255,255,255,.18) !important}
#logo a{color:#fff}
#topsearch input{border-color:#3a3a3a}

/* 移动端导航：折行显示全部（不再横向滚动只看到"首页"） */
@media (max-width:768px){
  #navhome,#head{overflow:visible !important;width:100%}
  #navhome>ul{display:flex !important;flex-wrap:wrap !important;white-space:normal !important;gap:4px 6px}
  #navhome>ul>li{flex:0 0 auto;position:static}
  #navhome>ul>li>a,#navhome>ul>li>span{padding:7px 10px;font-size:14px}
  #navhome .nav-multi>ul{position:static !important;display:grid !important;grid-template-columns:repeat(3,1fr);
    width:100%;max-height:none;overflow:visible;box-shadow:none;border:0;background:transparent;padding:4px 0 4px 6px}
  #navhome .nav-multi>ul>li>a{color:#fff !important;font-size:13px;padding:6px 8px}
  #navhome .nav-multi>span{width:100%}
}

/* 导航样式对齐 xiurenai.com：白底 + 深色字 + 悬停主题色 */
#head{background:#fff !important;box-shadow:0 1px 6px rgba(0,0,0,.06);padding:10px 12px}
#logo a,#logo span{color:#333 !important}
#navhome{background:transparent !important;padding:0}
#navhome>ul>li>a,#navhome>ul>li>span{color:#333 !important;font-size:16px;font-weight:500;padding:8px 14px;background:transparent !important}
#navhome>ul>li>a:hover,#navhome>ul>li>span:hover,
#navhome>ul>li:hover>a,#navhome>ul>li:hover>span{color:#e6407a !important;background:transparent !important}
#navhome .nav-multi>ul{background:#fff;border:1px solid #eee;box-shadow:0 6px 20px rgba(0,0,0,.08)}
#navhome .nav-multi>ul>li>a{color:#444 !important;font-size:15px}
#navhome .nav-multi>ul>li>a:hover{color:#e6407a !important;background:#fafafa !important}
#topsearch button{background:#e6407a}
@media (max-width:768px){
  #head{position:static !important}
  #navhome>ul>li>a,#navhome>ul>li>span{font-size:15px;padding:7px 10px;color:#333 !important}
  #navhome .nav-multi>ul{background:#fff !important}
  #navhome .nav-multi>ul>li>a{color:#444 !important}
}

/* 保持深底白字（撤销上一版的配色，只保留 xiurenai 的布局/交互） */
#head{background:#1b1b1b !important;box-shadow:0 1px 6px rgba(0,0,0,.2)}
#logo a,#logo span{color:#fff !important}
#navhome>ul>li>a,#navhome>ul>li>span{color:#fff !important;font-size:16px;padding:8px 14px}
#navhome>ul>li>a:hover,#navhome>ul>li>span:hover,
#navhome>ul>li:hover>a,#navhome>ul>li:hover>span{color:#fff !important;background:rgba(255,255,255,.18) !important}
#navhome .nav-multi>span{color:#fff !important}
#navhome .nav-multi>ul{background:#fff !important}
#navhome .nav-multi>ul>li>a,#navhome .nav-multi>ul>li>a:hover{color:#444 !important}
#navhome .nav-multi>ul>li>a:hover{background:#fafafa !important}
@media (max-width:768px){
  #navhome>ul>li>a,#navhome>ul>li>span{color:#fff !important;font-size:15px;padding:7px 10px}
}

/* 移动端导航（真正修复）：导航条不溢出，子菜单独占一行铺满 */
@media (max-width:768px){
  html,body{overflow-x:hidden}
  #head{width:100% !important;max-width:100%;box-sizing:border-box;flex-wrap:wrap}
  #navhome{width:100% !important;max-width:100%;left:auto !important;position:static !important;overflow:visible !important;box-sizing:border-box}
  #navhome>ul{display:flex !important;flex-wrap:wrap !important;width:100%;gap:2px 4px}
  #navhome>ul>li{flex:0 0 auto;width:auto !important}
  #navhome>ul>li.nav-multi{flex:1 1 100%;width:100% !important}
  #navhome .nav-multi>span{display:block;width:100%}
  #navhome .nav-multi>ul{position:static !important;display:grid !important;width:100% !important;
    grid-template-columns:repeat(3,1fr);gap:2px 4px;max-height:none;overflow:visible;
    background:transparent !important;border:0;box-shadow:none;padding:4px 0 6px}
  #navhome .nav-multi>ul>li{width:auto !important}
  #navhome .nav-multi>ul>li>a{color:#fff !important;font-size:13px;padding:6px 8px;border-radius:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #navhome .nav-multi>ul>li>a:hover{background:rgba(255,255,255,.16) !important;color:#fff !important}
  #topsearch{width:100%}
}

/* 电脑端：导航居中（搜框已移除） */
#head{justify-content:center;flex-wrap:wrap;row-gap:6px}
#logo{width:100%;text-align:center}
#navhome{width:100%}
#navhome>ul{justify-content:center;width:100%}
#topsearch{display:none !important}
@media (max-width:768px){ #logo{text-align:left} #navhome>ul{justify-content:flex-start} }

/* 撤销"导航居中"，恢复原布局；只去掉右侧搜索输入框 */
#head{justify-content:flex-start !important;flex-wrap:nowrap;row-gap:0}
#logo{width:auto !important;text-align:left !important}
#navhome{width:auto !important;margin-left:10px}
#navhome>ul{justify-content:flex-start !important;width:auto !important}
#topsearch{display:none !important}
@media (max-width:768px){ #head{flex-wrap:wrap} #navhome{width:100% !important;margin-left:0} }

/* ================= 导航：按 xiurenai.com 的结构与样式 ================= */
.xrn-header{background:#fff;box-shadow:0 2px 10px rgba(78,82,84,.10);position:relative;z-index:100}
.xrn-inner{max-width:1330px;margin:0 auto;padding:0 12px;display:flex;align-items:center;height:70px;box-sizing:border-box}
.xrn-header .logo img{max-height:46px;display:block}
.nav-main{display:flex;align-items:center;list-style:none;margin:0 0 0 30px;padding:0;font-size:16px}
.nav-main>li{position:relative}
.nav-main>li>a{display:block;padding:0 16px;line-height:70px;color:#333}
.nav-main>li>a:hover{color:#e6407a}
.nav-main .sub-menu{display:none;position:absolute;left:0;top:70px;background:#fff;min-width:190px;padding:8px;
  box-shadow:0 6px 20px rgba(0,0,0,.10);z-index:99;list-style:none;max-height:420px;overflow:auto}
.nav-main>li:hover>.sub-menu{display:block}
.nav-main .sub-menu a{display:block;padding:8px 12px;color:#444;font-size:15px;white-space:nowrap;border-radius:4px}
.nav-main .sub-menu a:hover{color:#e6407a;background:#fafafa}
@media (max-width:768px){
  .xrn-inner{height:auto;flex-wrap:wrap;padding:10px 12px;gap:6px}
  .xrn-header .logo img{max-height:38px}
  .nav-main{width:100%;margin:6px 0 0;flex-wrap:wrap;font-size:15px;gap:2px 4px}
  .nav-main>li>a{line-height:2;padding:0 12px;color:#333}
  .nav-main .sub-menu{position:static;display:grid !important;grid-template-columns:repeat(3,1fr);gap:2px 4px;
    box-shadow:none;border:0;padding:4px 0 6px 6px;max-height:none;overflow:visible;min-width:0}
  .nav-main .sub-menu a{font-size:13px;padding:6px 8px;color:#444}
}

/* logo 小一号 */
.xrn-header .logo img{max-height:34px !important;width:auto}
@media (max-width:768px){ .xrn-header .logo img{max-height:28px !important} }
/* 首页卡片：封面自适应卡片宽度，避免错位 */
.loop_pic .group{overflow:hidden}
.loop_pic .group .photo{position:relative !important;top:auto;left:auto;right:auto;width:100%;
  aspect-ratio:1/1;border-radius:6px;overflow:hidden;background:#f3f3f3}
.loop_pic .group .photo img{width:100% !important;height:100% !important;object-fit:cover;display:block;margin:0}
.loop_pic .group:before{display:none !important}

/* 移动端：导航收起，改汉堡按钮展开（照 xiurenai） */
@media (max-width:768px){
  .nav-main{display:none !important;width:100%;margin:6px 0 0;flex-direction:column;align-items:stretch}
  .nav-main.open{display:flex !important}
  .nav-main>li{width:100%}
  .nav-main>li>a{display:block;padding:11px 4px;border-bottom:1px solid #f0f0f0;color:#333;line-height:1.4}
  .nav-main .sub-menu{position:static !important;display:none !important;box-shadow:none;border:0;padding:2px 0 6px 14px;max-height:none;overflow:visible;min-width:0}
  .nav-main>li.open>.sub-menu{display:grid !important;grid-template-columns:repeat(2,1fr);gap:2px 6px}
  .nav-main .sub-menu a{font-size:13px;padding:6px 8px;color:#555}
  .xrn-burger{display:flex !important}
}
.xrn-burger{display:none;margin-left:auto;width:42px;height:42px;align-items:center;justify-content:center;
  background:transparent;border:0;cursor:pointer;font-size:24px;line-height:1;color:#333}

/* 桌面端 logo 固定尺寸 144x60 */
@media (min-width:769px){
  .xrn-header .logo img{width:144px !important;height:60px !important;object-fit:contain;max-height:none !important}
  .xrn-inner{height:76px}
  .nav-main>li>a{line-height:76px}
  .nav-main .sub-menu{top:76px}
}

/* 搜索结果列表 */
#results{display:block;clear:both;width:100%}
#results .slist{list-style:none;margin:0;padding:0;clear:both}
#results .slist li{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:11px 4px;border-bottom:1px solid #f2f2f2;font-size:15px}
#results .slist li a{color:#333;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#results .slist li a:hover{color:#e6407a}
#results .slist li em{color:#999;font-style:normal;font-size:13px;flex:0 0 auto}

/* 底部友情链接栏 */
#ft .friends-bar{max-width:1330px;margin:6px auto 0;padding:10px 0 0;border-top:1px solid #ececec;
  font-size:12.5px;line-height:2;color:#999;text-align:center}
#ft .friends-bar .fl-label{color:#888;font-weight:600;margin-right:6px}
#ft .friends-bar a{color:#888;margin:0 8px;text-decoration:none}
#ft .friends-bar a:hover{color:#e6407a}
@media (max-width:768px){ #ft .friends-bar{font-size:12px} #ft .friends-bar a{margin:0 6px} }

/* 收窄底部间距：内容区 -> 版权行 */
#ft{padding:8px 12px 26px !important}
#index-page,#thread-page{padding:6px 0 0 !important}
#index-bottom,#index-page .pg{padding-top:10px !important}
.loop_pic .group{margin-bottom:12px !important}
#ft .friends-bar{margin-top:2px;padding-top:8px}
