:root{
  --text:#fff;
  --glass:rgba(255,255,255,.10);
  --glass-strong:rgba(255,255,255,.18);
  --mask:rgba(15,23,42,.45);
  --accent:#2563eb;
  --radius:16px;
  --blur:14px;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html,body{min-height:100%;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  color:var(--text);
  min-height:100vh;
  background:#1e293b;
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
/* ---------- 背景层 ---------- */
.bg-layer{
  position:fixed;inset:0;z-index:-2;
  background-size:cover;background-position:center;
  background-image:linear-gradient(135deg,#1e3a8a,#0f172a);
  transform:scale(1.04);
  opacity:1;transition:opacity .9s ease, background-image .9s ease;
}
.bg-layer.fading{opacity:0;}
.bg-mask{
  position:fixed;inset:0;z-index:-1;
  background:#0f172a;
}
/* ---------- 顶部栏 ---------- */
.topbar{
  display:flex;justify-content:space-between;align-items:flex-start;
  padding:18px 24px;font-size:14px;gap:12px;
}
.topbar-left{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.chip{
  display:flex;gap:6px;align-items:center;
  background:var(--glass);backdrop-filter:blur(var(--blur));
  border:1px solid rgba(255,255,255,.18);
  padding:7px 13px;border-radius:22px;
  box-shadow:0 4px 16px rgba(0,0,0,.18);
}
.clock-time{font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;}
.clock-date{font-size:12px;opacity:.85;}
.weather{cursor:pointer;position:relative;}
.weather-ext{display:block;font-size:11px;opacity:.8;margin-top:2px;}
/* 城市选择器：点击城市名唤起，用于修正 IP 定位不准的情况 */
.weather-city{cursor:pointer;border-bottom:1px dashed rgba(255,255,255,.3);}
.weather-city:hover{color:#fff;}
.weather-picker{
  position:absolute;top:100%;left:0;z-index:60;margin-top:6px;
  background:var(--glass);backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:6px;
  box-shadow:0 8px 28px rgba(0,0,0,.35);animation:fadeUp .16s ease both;
}
.weather-city-sel{
  min-width:150px;max-width:70vw;padding:7px 10px;border-radius:8px;
  border:1px solid rgba(255,255,255,.18);background:rgba(15,23,42,.85);
  color:#e2e8f0;font-size:13px;cursor:pointer;
}
.topbar-right{display:flex;align-items:center;gap:10px;}
/* 时间模块位置：topbar-pos-* 修饰 header 本身。
   注意不能复用 .topbar-left/.topbar-right 这两个内部容器类名，否则 header 会
   误命中子元素样式（曾导致后台「位置」设置无效）。
   ⚠️ right 不能用 flex-direction:row-reverse——那会把用户菜单挤到最左边，
   其下拉菜单(right:0 向左展开)会悬出视口左缘被 overflow-x:hidden 裁掉半边。 */
.topbar.topbar-pos-right{justify-content:flex-end;}  /* 时间+登录整体靠右，时间紧挨头像左侧 */
.topbar.topbar-pos-center{position:relative;justify-content:flex-end;} /* 时间绝对居中，登录区仍靠右 */
.topbar.topbar-pos-center .topbar-left{position:absolute;left:50%;transform:translateX(-50%);}
.user-menu{
  position:relative;display:flex;align-items:center;gap:8px;cursor:pointer;
  padding-bottom:6px;   /* 预留 hover 通道，见下方 dropdown 的 padding-top 桥接说明 */
}
.user-menu .avatar{width:34px;height:34px;border-radius:50%;border:2px solid #fff;object-fit:cover;}
.user-menu .nick{font-size:13px;}
.user-menu .caret{font-size:10px;opacity:.7;transition:transform .2s;}
.user-menu.open .caret{transform:rotate(180deg);}
/*
 * 下拉菜单：用 padding-top 做「hover 桥接」。
 * 绝对定位元素与其父级之间的空隙会让指针在移动途中短暂脱离 :hover，
 * 导致菜单闪退。padding 属于元素自身盒子，因此这段间隙仍在 hover 区域内；
 * 实际白底交给内层 .dd-inner 绘制。
 */
.user-menu .dropdown{
  display:none;position:absolute;right:0;top:100%;
  margin-top:6px;padding-top:6px;          /* 视觉间隙 + hover 桥接 */
  background:transparent;box-shadow:none;min-width:158px;
  z-index:30;overflow:visible;
}
.user-menu:hover .dropdown,
.user-menu.open .dropdown{display:block;}
.user-menu .dropdown .dd-inner{
  background:#fff;color:#222;border-radius:12px;overflow:hidden;
  box-shadow:0 14px 40px rgba(0,0,0,.28);border:1px solid rgba(0,0,0,.05);
  animation:ddIn .16s ease-out;
}
@keyframes ddIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
.user-menu .dropdown a{
  display:block;padding:11px 16px;text-decoration:none;color:#222;font-size:14px;
  transition:background .12s;
}
.user-menu .dropdown a:hover{background:#f1f5f9;}
.user-menu .dropdown a.danger{color:#dc2626;}
.user-menu .dropdown a.danger:hover{background:#fef2f2;}
.user-menu .dropdown .dd-sep{height:1px;background:#f1f5f9;margin:4px 0;}
.btn-login{
  display:inline-block;padding:8px 18px;background:var(--accent);
  border-radius:22px;text-decoration:none;color:#fff;font-size:14px;
  box-shadow:0 4px 14px rgba(37,99,235,.4);transition:transform .15s,box-shadow .15s;
}
.btn-login:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(37,99,235,.55);}
/* 注册按钮与登录按钮保持完全一致（同蓝底 + 白字），不再做描边差异化 */
.wx-tip{font-size:12px;opacity:.7;}
/* ---------- 主区 ---------- */
.hero{display:flex;flex-direction:column;align-items:center;padding:7vh 16px 4vh;text-align:center;}
.hero-title{
  font-size:clamp(30px,5.4vw,52px);font-weight:800;letter-spacing:1px;
  /* 长标题在窄屏/大字号下必须能断行，否则会把页面撑出横向滚动条
     （word-break:break-word 作为老 Safari 的兜底，overflow-wrap:anywhere 为主） */
  overflow-wrap:anywhere;word-break:break-word;max-width:100%;
  text-shadow:0 3px 16px rgba(0,0,0,.45);
  animation:fadeUp .8s ease both;
}
.hero-quote{
  margin-top:14px;font-size:16px;opacity:.92;font-style:italic;
  overflow-wrap:anywhere;word-break:break-word;max-width:100%;
  animation:fadeUp 1s ease .15s both;
}
.hero-sub{
  margin-top:12px;font-size:15px;opacity:.78;letter-spacing:.5px;
  overflow-wrap:anywhere;word-break:break-word;max-width:100%;
  animation:fadeUp .9s ease .1s both;
}
.quote-by{opacity:.7;font-size:14px;margin-left:6px;font-style:normal;}
/* 引擎切换 */
.engine-bar{
  /* 关键修复：flex-wrap + justify-content:center —— 引擎多/屏幕窄时自动换行并保持水平居中。
     旧写法是 display:flex 不换行（默认 nowrap）+ overflow-x:auto，
     结果窄屏下按钮全部挤在一行跑出屏幕，只能横向滚动才能看全。 */
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:10px;width:100%;max-width:760px;margin:28px auto 0;padding:6px;
}
.engine-btn{
  position:relative;
  display:flex;align-items:center;gap:6px;white-space:nowrap;
  padding:9px 17px;border:1px solid rgba(255,255,255,.22);border-radius:24px;
  /* 未选中也用蓝底白字：原 rgba(255,255,255,.10) 半透明底在照片背景上
     文字对比度被背景吃掉、发灰不可读（见用户截图）。现在与登录/注册按钮统一。
     仍不用 backdrop-filter：引擎按钮换行后排成多排，Chromium 会把模糊区域
     渲染成不跟随圆角的矩形，照片背景上会露出硬边"方框"。 */
  background:var(--accent);
  color:#fff;cursor:pointer;font-size:14px;max-width:100%;
  transition:transform .25s cubic-bezier(.22,.61,.36,1),
             background-color .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.engine-btn img{width:18px;height:18px;border-radius:4px;}
/* 引擎名由后台自定义，可能很长：限宽并省略号截断，
   避免单个超长按钮把整行撑破（.engine-ico 是首字母兜底，不能被这条命中） */
.engine-btn>span:not(.engine-ico){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.engine-btn:hover{transform:translateY(-2px);background:var(--glass-strong);}
/* 激活态光晕：双层大模糊低透明，边缘衰减柔和，不再出现硬边光圈 */
/* 选中态：白环 + 更强光晕，与同为蓝底的未选中按钮拉开层次 */
.engine-btn.active{
  background:var(--accent);border-color:#fff;
  box-shadow:0 0 0 2px rgba(255,255,255,.65),
             0 3px 8px rgba(37,99,235,.22),0 8px 26px rgba(37,99,235,.42);
}
/* 搜索框 */
.search-box{width:min(660px,100%);margin-top:20px;animation:fadeUp 1s ease .25s both;}
.search-tabs{display:flex;gap:16px;justify-content:center;margin-bottom:12px;font-size:14px;}
.search-tabs .tab{cursor:pointer;opacity:.85;}
.search-tabs .tab input{vertical-align:-1px;margin-right:3px;}
.search-row{
  display:flex;background:#fff;border-radius:32px;overflow:hidden;
  box-shadow:0 10px 34px rgba(0,0,0,.3);transition:box-shadow .2s,transform .2s;
}
.search-row:focus-within{box-shadow:0 10px 40px rgba(37,99,235,.45);transform:translateY(-1px);}
.search-row input{flex:1;border:0;outline:none;padding:15px 22px;font-size:16px;color:#111;}
.search-row button{
  border:0;background:var(--accent);color:#fff;padding:0 30px;font-size:16px;cursor:pointer;
  transition:background .2s;
}
.search-row button:hover{background:#1d4ed8;}
/* 搜索历史下拉 */
.history{
  position:absolute;left:0;right:0;top:100%;margin-top:8px;z-index:30;
  background:#fff;color:#222;border-radius:14px;overflow:hidden;
  box-shadow:0 12px 32px rgba(0,0,0,.3);text-align:left;display:none;
}
.history.show{display:block;}
.history .h-item{padding:10px 18px;cursor:pointer;font-size:14px;border-bottom:1px solid #f1f5f9;}
.history .h-item:last-child{border-bottom:0;}
.history .h-item:hover{background:#f1f5f9;}
.search-wrap{position:relative;width:100%;}
/* ---------- 导航区 ---------- */
.nav-section{max-width:1100px;margin:0 auto;padding:20px 16px 50px;}
.nav-zone-title{
  font-size:17px;font-weight:600;margin:34px 0 16px;padding-left:12px;
  border-left:3px solid var(--accent);line-height:1.2;letter-spacing:.5px;
}
.nav-section > .nav-zone-title:first-child{margin-top:10px;}
.nav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;align-items:start;position:relative;}

/* 卡片：降低饱和、去掉重阴影，靠层次而非浮夸效果取胜 */
.nav-card{
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;padding:16px 8px 14px 18px;
  transition:transform .18s,background .2s,border-color .2s,box-shadow .2s;
}
.nav-card:hover{
  transform:translateY(-3px);
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.22);
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
/* 分类标题：与网址列表拉开层次 */
.nav-card h3{
  font-size:15px;font-weight:600;margin:0 0 12px;padding-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:space-between;gap:8px;
}
.nav-card ul{list-style:none;margin:0;padding:0;}
.nav-card li{
  margin:0;display:flex;align-items:center;justify-content:space-between;gap:6px;
  border-radius:8px;transition:background .15s;
}
.nav-card li:hover{background:rgba(255,255,255,.09);}
/* 网址链接：单行省略，绝不因图标/长文本挤压换行 */
.nav-card a{
  flex:1;min-width:0;color:rgba(255,255,255,.9);text-decoration:none;
  font-size:14px;line-height:1.5;padding:7px 8px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:8px;
  display:block;transition:color .15s,background .15s;
}
.nav-card a:hover{color:#fff;background:rgba(37,99,235,.45);text-decoration:none;}
.nav-card.empty,.nav-empty-li{opacity:.55;font-size:13px;padding:6px 8px;}
/* 删除按钮：平时低调，悬停行内才醒目 */
.del{
  flex-shrink:0;border:0;background:transparent;color:rgba(255,255,255,.6);
  cursor:pointer;font-size:17px;line-height:1;padding:0 7px;border-radius:6px;
  opacity:0;display:none;transition:opacity .15s,color .15s,background .15s;
  /* 触控目标 ≥24×24（WCAG 2.5.8），原 padding:4px 8px 高度不足 24px */
  min-width:28px;min-height:28px;align-items:center;justify-content:center;
}
.nav-card li:hover .del{opacity:1;}
.del:hover{color:#fff;background:rgba(239,68,68,.85);}
.foot{text-align:center;padding:22px;font-size:13px;opacity:.55;}
/* 页脚分两行：版权 / 备案号。备案号是法务要求内容，单独一行更醒目 */
.foot-line{display:inline-block;}
.foot-record{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;align-items:center;}
/* 备案链接对比度：父级 .foot 只有 .55 透明度，直接沿用会让链接几乎看不清。
   提到 .8 并加下划线，满足主管部门「点击可跳转」的可辨识要求。 */
.foot-record a{color:rgba(255,255,255,.82);text-decoration:underline;text-underline-offset:3px;transition:color .15s;}
.foot-record a:hover{color:#fff;}
.foot-record span{color:rgba(255,255,255,.7);}
/* 公安备案图标：官方要求必须带图标，必须给足尺寸否则会被压成不可辨认 */
.foot-mps-ico{width:16px;height:16px;vertical-align:-3px;margin-right:4px;border-radius:2px;}
/* ---------- 访客公网IP 板块（单行胶囊，居中悬挂在搜索框下方） ---------- */
.sysinfo{
  display:flex;align-items:center;justify-content:center;gap:6px;
  width:fit-content;max-width:100%;margin:0 auto 12px;padding:10px 22px;
  background:var(--glass);backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  border:1px solid rgba(255,255,255,.12);border-radius:22px;
  box-shadow:0 6px 22px rgba(0,0,0,.16);
  animation:fadeUp 1s ease .3s both;
}
.sysinfo-label{opacity:.8;font-size:13px;letter-spacing:1px;}
.sysinfo-value{
  font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;
  word-break:break-all;line-height:1.35;
}
/* ---------- 动画 ---------- */
@keyframes fadeUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
/* ---------- 响应式 ---------- */
@media (max-width:640px){
  .topbar{flex-direction:column;align-items:stretch;gap:10px;padding:12px 14px;}
  .topbar-right{justify-content:flex-end;}
  /* 窄屏纵向堆叠时，center 的绝对居中让路 */
  .topbar.topbar-pos-center .topbar-left{position:static;transform:none;}
  .weather .weather-ext{display:none;}
  .weather.expanded .weather-ext{display:block;}
  .hero{padding-top:3vh;}
  .hero-title{font-size:clamp(26px,8vw,38px);}
  .hero-quote{font-size:14px;}
  /* 引擎栏随窄屏收缩：按钮换行后仍保持居中，不溢出 */
  .engine-bar{gap:8px;margin-top:20px;padding:4px;}
  .engine-btn{padding:7px 13px;font-size:13px;gap:5px;border-radius:20px;}
  .engine-btn img{width:16px;height:16px;}
  .search-row button{padding:0 20px;}
  .nav-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));}
  .sysinfo{padding:8px 16px;font-size:14px;}
}
/* 平板：导航卡片给更宽的最小列，避免一行只放 2 个显得稀疏 */
@media (min-width:641px) and (max-width:1024px){
  .engine-bar{max-width:640px;}
  .nav-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));}
}
@media (max-width:380px){
  .hero-quote{display:none;}
  .clock-date{display:none;}
  /* 超窄屏（iPhone SE / 小安卓）进一步压缩，保证一行放得下 3 个左右 */
  .engine-bar{gap:6px;margin-top:16px;padding:2px;}
  .engine-btn{padding:6px 10px;font-size:12px;border-radius:18px;}
  .engine-btn img{width:15px;height:15px;}
}
/* ---------- 刘海屏 / 微信内置浏览器安全区 ----------
   内容避开 Home Indicator 与刘海，避免贴边被遮挡。
   用 @supports 包住：老浏览器不认 env() 时整条声明失效，
   上面原有的 padding 规则继续生效，不会出现「完全没内边距」。 */
@supports (padding:max(0px)){
  .topbar{
    padding-left:max(14px,env(safe-area-inset-left));
    padding-right:max(14px,env(safe-area-inset-right));
  }
  .hero{
    padding-left:max(16px,env(safe-area-inset-left));
    padding-right:max(16px,env(safe-area-inset-right));
  }
  .foot{
    padding-left:max(16px,env(safe-area-inset-left));
    padding-right:max(16px,env(safe-area-inset-right));
  }
}
/* ---------- 后台管理 ---------- */
.admin-body{background:#eef2f7;color:#1e293b;}
.admin{display:flex;min-height:100vh;}
.admin-side{width:210px;background:#0f172a;color:#cbd5e1;padding:20px 0;flex-shrink:0;}
.admin-logo{color:#fff;font-size:18px;font-weight:700;padding:0 20px 18px;line-height:1.3;}
.admin-logo small{font-size:12px;opacity:.6;font-weight:400;}
.admin-side nav a{display:block;color:#cbd5e1;padding:11px 20px;text-decoration:none;font-size:14px;border-left:3px solid transparent;}
.admin-side nav a:hover{background:#1e293b;color:#fff;}
.admin-side nav a.active{background:#1e293b;color:#fff;border-left-color:#2563eb;}
.admin-main{flex:1;display:flex;flex-direction:column;min-width:0;}
.admin-topbar{display:flex;justify-content:space-between;align-items:center;padding:14px 24px;background:#fff;border-bottom:1px solid #e2e8f0;font-size:14px;}
.admin-content{padding:24px;overflow:auto;}
.btn-sm{padding:6px 14px;background:#2563eb;color:#fff;border-radius:8px;text-decoration:none;font-size:13px;}
.card{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 10px rgba(0,0,0,.05);margin-bottom:20px;}
.card h3{margin:0 0 16px;font-size:16px;border-left:4px solid #2563eb;padding-left:10px;}
.form-row{display:flex;flex-wrap:wrap;gap:18px;}
.field{margin-bottom:14px;flex:1;min-width:220px;}
.field label{display:block;font-size:13px;color:#475569;margin-bottom:6px;}
.field input,.field select,.field textarea{width:100%;padding:9px 11px;border:1px solid #cbd5e1;border-radius:8px;font-size:14px;box-sizing:border-box;background:#fff;}
/* 粘贴统计代码用：等宽字体 + 足够高度，便于阅读缩进 */
.field textarea{
  min-height:130px;resize:vertical;line-height:1.5;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;
  font-size:13px;white-space:pre;overflow-wrap:normal;overflow-x:auto;
}
.field input[type=checkbox]{width:auto;transform:scale(1.2);margin-right:6px;vertical-align:-2px;}
.field .hint{font-size:12px;color:#94a3b8;margin-top:4px;}
.btn-primary{padding:10px 22px;background:#2563eb;color:#fff;border:0;border-radius:8px;cursor:pointer;font-size:14px;}
.btn-primary:hover{background:#1d4ed8;}
.btn-danger{padding:5px 12px;background:#ef4444;color:#fff;border:0;border-radius:6px;cursor:pointer;font-size:12px;text-decoration:none;}
.btn-edit{padding:5px 12px;background:#0ea5e9;color:#fff;border:0;border-radius:6px;cursor:pointer;font-size:12px;text-decoration:none;}
table.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:10px;overflow:hidden;margin-top:6px;}
table.tbl th,table.tbl td{padding:11px 12px;text-align:left;border-bottom:1px solid #e2e8f0;font-size:14px;}
table.tbl th{background:#f8fafc;color:#475569;font-weight:600;}
table.tbl tr:hover td{background:#f8fafc;}
.muted{color:#94a3b8;font-size:12px;}
.ok-msg{background:#dcfce7;color:#166534;padding:10px 14px;border-radius:8px;margin-bottom:14px;}
.err-msg{background:#fee2e2;color:#991b1b;padding:10px 14px;border-radius:8px;margin-bottom:14px;}
.mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;}
.mod-grid .m{background:#fff;border-radius:10px;padding:18px;text-align:center;box-shadow:0 2px 10px rgba(0,0,0,.05);}
.mod-grid .m a{color:#2563eb;text-decoration:none;font-weight:600;}
@media (max-width:720px){.admin-side{width:140px;}.admin-side nav a{padding:10px 12px;font-size:13px;}}
/* 我的导航：工具条与表单（卡片/链接/删除按钮样式已统一在上面「导航区」维护，此处不再重复定义） */
.nav-zone-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.nav-zone-btns{display:none;gap:8px;flex-wrap:wrap;margin-left:auto;}
.btn-add{padding:6px 14px;background:#2563eb;color:#fff;border:0;border-radius:8px;cursor:pointer;font-size:13px;transition:background .15s;}
.btn-add:hover{background:#1d4ed8;}
.btn-add-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.45);}
.btn-add-ghost:hover{background:rgba(255,255,255,.16);}

.cat-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cat-ops{display:none;gap:2px;flex-shrink:0;opacity:0;transition:opacity .15s;}
.my-nav-card:hover .cat-ops{opacity:1;}
.cat-op{
  border:0;background:transparent;color:rgba(255,255,255,.5);cursor:pointer;
  font-size:13px;line-height:1;padding:0 6px;border-radius:6px;transition:all .15s;
  /* 触控目标 ≥24×24（WCAG 2.5.8） */
  min-width:28px;min-height:28px;display:inline-flex;align-items:center;justify-content:center;
}
.cat-op:hover{color:#fff;background:rgba(255,255,255,.2);}
.cat-op-danger:hover{background:rgba(239,68,68,.85);color:#fff;}

/* 站内搜索结果栏 / 分享导入提示条（共用一套样式） */
.search-result-bar,
.notice-bar{
  display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;
  width:fit-content;max-width:100%;margin:0 auto 14px;padding:8px 18px;
  background:var(--glass);backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  border:1px solid rgba(255,255,255,.12);border-radius:20px;font-size:13px;
}
.search-result-bar b{font-weight:700;}
.search-result-bar .sr-clear{
  color:#fff;text-decoration:none;padding:3px 12px;border-radius:14px;
  background:rgba(255,255,255,.16);transition:background .15s;
}
.search-result-bar .sr-clear:hover{background:rgba(255,255,255,.32);}

/* 编辑首页：默认只读，仅在 body.edit-mode（点了「编辑首页」）时才显示增删改控件，避免误触删除 */
body.edit-mode .nav-zone-btns{display:flex;}
body.edit-mode .my-nav-card .cat-ops{display:flex;opacity:1;}
body.edit-mode .my-nav-card .del{display:inline-flex;opacity:1;}
body.edit-mode .nav-card li:hover .del{opacity:1;}

/* 用户菜单里的「编辑首页」切换项（与 .dropdown a 同款样式） */
.user-menu .dropdown .dd-item{
  display:block;width:100%;text-align:left;background:none;border:0;font-family:inherit;
  cursor:pointer;padding:11px 16px;color:#222;font-size:14px;transition:background .12s;
}
.user-menu .dropdown .dd-item:hover{background:#f1f5f9;}
.user-menu .dropdown .dd-item.is-on{color:#2563eb;font-weight:600;}
/* 私密收藏夹解锁入口（琥珀色点缀 = 有事待办；锁图标已在文案里，不靠颜色单独传达） */
.user-menu .dropdown .dd-item.dd-priv{color:#b45309;}
.user-menu .dropdown .dd-item.dd-priv:hover{background:#fffbeb;color:#92400e;}

/* 「我的导航」标题旁的「编辑中」徽标 */
.edit-badge{
  display:none;align-items:center;gap:5px;font-size:12px;font-weight:600;
  color:#fff;background:rgba(37,99,235,.78);padding:3px 11px;border-radius:12px;
}
body.edit-mode .edit-badge{display:inline-flex;}

.my-nav-form{
  background:rgba(255,255,255,.96);color:#222;padding:14px;border-radius:12px;
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:18px;
  box-shadow:0 6px 20px rgba(0,0,0,.18);
}
.my-nav-form input,.my-nav-form select{
  padding:8px 10px;border:1px solid #cbd5e1;border-radius:8px;font-size:14px;background:#fff;
}
.my-nav-form input{min-width:170px;}
.my-nav-form select{min-width:150px;}
.my-nav-form button{padding:8px 14px;border:0;border-radius:8px;background:#2563eb;color:#fff;cursor:pointer;font-size:14px;}
.my-nav-form button[type=button]{background:#94a3b8;}
.my-nav-form button:hover{filter:brightness(1.08);}
.nav-empty-li{opacity:.55;font-size:13px;}
/* 搜索引擎图标：首字母兜底（图标加载失败时露出，不出现破图） */
.engine-ico{display:none;}
.engine-btn:not(.has-ico) .engine-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;border-radius:4px;background:rgba(255,255,255,.22);
  font-size:11px;font-weight:700;line-height:1;
}
.engine-btn.active:not(.has-ico) .engine-ico{background:rgba(255,255,255,.35);}
/* 说明：导航卡片的网址图标已按需求移除（前台不展示 icon）。
   后台抓取到的 favicon 仍会写入 nav_sites.icon 字段保留，日后想恢复展示从这里加规则即可。 */
/* 微信内置浏览器兼容 */
img{-webkit-user-drag:none;}
a{-webkit-touch-callout:none;}
/* ---------- 收藏夹导入模态框 ---------- */
.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;z-index:60;padding:16px;}
.modal-box{width:min(560px,94vw);max-height:88vh;overflow:auto;background:#0f172a;border:1px solid rgba(255,255,255,.14);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.5);}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.1);font-size:16px;font-weight:600;}
.modal-x{background:transparent;border:0;color:#cbd5e1;font-size:22px;line-height:1;cursor:pointer;}
.modal-x:hover{color:#fff;}
.modal-body{padding:16px 18px;}
.modal-tip{font-size:13px;opacity:.75;margin:0 0 12px;line-height:1.6;}
.modal-split{text-align:center;opacity:.6;margin:8px 0;font-size:13px;}
#bmFile,#bmPaste{display:block;width:100%;box-sizing:border-box;margin-bottom:10px;background:rgba(15,23,42,.6);border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#cbd5e1;font-size:14px;padding:9px 12px;}
#bmPaste{height:90px;resize:vertical;font-family:inherit;}
.btn-primary{display:inline-block;background:var(--accent);color:#fff;border:0;border-radius:22px;padding:9px 20px;font-size:14px;cursor:pointer;box-shadow:0 4px 14px rgba(37,99,235,.4);transition:transform .15s,box-shadow .2s;}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(37,99,235,.55);}
.modal-msg{display:inline-block;margin-left:10px;font-size:13px;color:#fca5a5;}
.bm-result{max-height:46vh;overflow:auto;margin-bottom:12px;}
.bm-cat{border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:10px 12px;margin-bottom:10px;}
.bm-cat-head{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;cursor:pointer;}
.bm-bm-list{margin:8px 0 0 22px;display:flex;flex-direction:column;gap:4px;}
.bm-bm{display:flex;align-items:center;gap:8px;font-size:13px;opacity:.9;cursor:pointer;}
.bm-bm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:90%;}

/* ==================== 分类页（cat.php） ==================== */
/* 面包屑：给搜索引擎与用户都提供清晰的层级 */
.crumb{display:flex;align-items:center;gap:8px;justify-content:center;font-size:13px;opacity:.75;margin-bottom:10px;flex-wrap:wrap;}
.crumb a{color:rgba(255,255,255,.8);text-decoration:none;transition:color .2s;}
.crumb a:hover{color:#fff;text-decoration:underline;}
.crumb span:last-child{color:rgba(255,255,255,.6);max-width:70vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* 卡片标题变链接（首页分类名 → /cat_<id>.html）
   继承原色，不加下划线，避免改变原有卡片观感 */
.nav-card h3 a{color:inherit;text-decoration:none;transition:color .2s;}
.nav-card h3 a:hover{color:var(--accent);}

/* ==================== 拖拽改分类 + 单链分享 ==================== */
/* 拖拽手柄：仅编辑态显示。平时不占位也不可拖，避免影响点链接与选中文本 */
.drag-handle{
  flex:none;display:none;align-items:center;justify-content:center;
  width:14px;height:24px;margin-left:-2px;
  color:rgba(255,255,255,.32);font-size:12px;line-height:1;
  cursor:grab;user-select:none;-webkit-user-select:none;
}
body.edit-mode .my-nav-card .drag-handle{display:inline-flex;}
body.edit-mode .my-nav-card li:hover .drag-handle{color:rgba(255,255,255,.72);}
.drag-handle:active{cursor:grabbing;}

/* 拖拽中：源条目淡化；目标分类整卡高亮 */
.nav-card li.dragging{opacity:.35;}
.my-nav-card.drag-over{
  border-color:var(--accent);
  box-shadow:0 0 0 2px rgba(37,99,235,.45);
}
.my-nav-card.drag-over ul{background:rgba(37,99,235,.12);border-radius:10px;}

/* 单链分享按钮：与删除按钮同样低调，仅编辑态可见 */
.share-one{
  flex-shrink:0;border:0;background:transparent;color:rgba(255,255,255,.6);
  cursor:pointer;font-size:13px;line-height:1;padding:0 7px;border-radius:6px;
  opacity:0;display:none;transition:opacity .15s,color .15s,background .15s;
  /* 触控目标 ≥24×24（WCAG 2.5.8） */
  min-width:28px;min-height:28px;align-items:center;justify-content:center;
}
body.edit-mode .my-nav-card .share-one{display:inline-flex;opacity:1;}
.share-one:hover{color:#fff;background:rgba(37,99,235,.8);}

/* 编辑网址按钮（与 .share-one 同规格；hover 绿色以区别于蓝色的分享） */
.edit-one{
  flex-shrink:0;border:0;background:transparent;color:rgba(255,255,255,.6);
  cursor:pointer;font-size:13px;line-height:1;padding:0 7px;border-radius:6px;
  opacity:0;display:none;transition:opacity .15s,color .15s,background .15s;
  min-width:28px;min-height:28px;align-items:center;justify-content:center;
}
body.edit-mode .my-nav-card .edit-one{display:inline-flex;opacity:1;}
.edit-one:hover{color:#fff;background:rgba(16,185,129,.8);}

/* 就地编辑行：点 ✎ 后在该网址下方展开，可改名称与网址 */
.site-edit-row{
  display:flex;flex-direction:column;gap:6px;margin:6px 0;
  padding:10px 12px;border-radius:10px;
  background:rgba(15,23,42,.55);
  border:1px solid rgba(255,255,255,.16);
}
.site-edit-row input{
  width:100%;padding:7px 10px;border-radius:7px;font-size:13px;
  border:1px solid rgba(255,255,255,.22);background:rgba(15,23,42,.75);color:#fff;
}
.site-edit-row input:focus-visible{outline:2px solid #93c5fd;outline-offset:1px;}
.site-edit-row button{
  align-self:flex-start;padding:6px 16px;border:0;border-radius:7px;
  background:var(--accent);color:#fff;font-size:13px;cursor:pointer;
}
.site-edit-row button:disabled{opacity:.6;cursor:not-allowed;}
.site-edit-row .se-cancel{background:rgba(148,163,184,.35);color:#e2e8f0;margin-left:8px;}
.site-edit-row .se-cancel:hover{background:rgba(148,163,184,.5);}

/* 拖拽插入位置指示线（分类内排序 / 跨分类插入时显示落在哪一条之前） */
.drop-line{
  display:none;position:absolute;left:0;height:3px;pointer-events:none;z-index:5;
  background:var(--accent);border-radius:2px;
  box-shadow:0 0 8px rgba(37,99,235,.9);
}

/* ============================================================
   无障碍（Accessibility / a11y）
   ============================================================ */

/* ---------- 键盘焦点可见性 ----------
   原先全站没有任何 :focus 样式，键盘用户完全看不到焦点落在哪个元素上。
   深色玻璃背景上浏览器默认 outline 太弱，这里用高亮蓝 + 外扩，保证清晰可见。 */
:focus-visible{
  outline:3px solid #93c5fd;
  outline-offset:2px;
  border-radius:4px;
}
/* 玻璃拟态元素上的焦点环：外扩 outline 会被 overflow 裁掉，改用外发光阴影 */
.engine-btn:focus-visible,
.btn-login:focus-visible,
.weather-city:focus-visible,
.nav-card .del:focus-visible,
.nav-card .share-one:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(147,197,253,.55),0 0 0 6px rgba(15,23,42,.55);
}
/* 拖拽手柄获得焦点时也要明显（键盘用户的「抓手柄」入口） */
.drag-handle:focus-visible{
  outline:3px solid #93c5fd;
  outline-offset:1px;
  color:#fff;
  background:rgba(147,197,253,.25);
  border-radius:4px;
}
/* 下拉框/输入框获得焦点 */
.weather-city-sel:focus-visible{outline:3px solid #93c5fd;outline-offset:1px;}
/* 后台是浅色底（#eef2f7），浅蓝焦点环对比度仅 1.8:1（WCAG 要求 ≥3:1），换深蓝 */
.admin-body :focus-visible{outline-color:#1d4ed8;}
.admin-body :focus-visible{box-shadow:0 0 0 3px rgba(29,78,216,.28);}
/* 搜索框：保留 outline（focus-within 的光晕是附加效果，不作为唯一指示） */

/* ---------- 尊重「减少动效」偏好（WCAG 2.3.3）----------
   前庭功能障碍用户对大幅动画会产生眩晕。开启系统设置后统一降级。 */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .bg-layer{transition:none !important;}
  .engine-btn:hover,.btn-login:hover,.nav-card:hover{transform:none !important;}
}

/* ---------- 仅屏幕阅读器可见（用于给无 label 输入框补可访问名称） ---------- */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ---------- 跳转链接（键盘/读屏用户跳过顶栏直接到内容） ---------- */
.skip-link{
  position:absolute;left:8px;top:-60px;z-index:999;
  padding:10px 16px;border-radius:0 0 10px 10px;
  background:var(--accent);color:#fff;font-size:14px;text-decoration:none;
  transition:top .2s ease;
}
.skip-link:focus{top:0;}

/* ---------- 触控目标 / 对比度说明 ----------
   图标按钮（.del / .share-one / .cat-op）的 min-width/min-height:28px
   与颜色 rgba(255,255,255,.6) 已**合并进各自的原始定义**（见文件中部），
   此处不再重复定义，避免同一选择器两处出现互相覆盖。
   实测对比度：.35 → 3.11:1（FAIL）→ .6 → 6.21:1（PASS）。 */

/* ============================================================
   私密收藏夹（分类级二级密码）
   ============================================================ */

/* 未解锁时的提示卡片：横跨整行，明确告诉用户「有东西被锁着，需要密码」 */
.priv-card{
  grid-column:1/-1;background:rgba(37,99,235,.10);
  border:1px dashed rgba(147,197,253,.45);
}
.priv-lock{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:2px 0;
}
.priv-ico{font-size:26px;line-height:1;flex-shrink:0;}
.priv-txt{flex:1;min-width:120px;display:flex;flex-direction:column;gap:3px;}
.priv-txt b{font-size:15px;color:#fff;}
.priv-txt span{font-size:13px;opacity:.75;}
.btn-unlock{
  flex-shrink:0;padding:8px 18px;border:0;border-radius:20px;
  background:var(--accent);color:#fff;font-size:13px;cursor:pointer;
  box-shadow:0 4px 14px rgba(37,99,235,.4);
  transition:transform .15s,box-shadow .2s,background .15s;
  /* 触控目标 ≥24×24（WCAG 2.5.8） */
  min-height:34px;min-width:34px;
}
.btn-unlock:hover{background:#1d4ed8;transform:translateY(-1px);box-shadow:0 6px 18px rgba(37,99,235,.55);}

/* 已解锁的私密分类：左侧一条金色/青色竖条提示「这个是被保护过的」 */
.my-nav-card.is-locked{border-color:rgba(147,197,253,.42);}
.my-nav-card.is-locked::before{
  content:'';position:absolute;left:0;top:14px;bottom:14px;width:3px;
  border-radius:0 3px 3px 0;background:linear-gradient(180deg,#93c5fd,#38bdf8);
}
.my-nav-card{position:relative;}
.cat-lock-ico{font-size:12px;margin-right:4px;opacity:.9;}
/* 锁按钮在分类操作条里要一眼可辨，但沿用 .cat-op 的低调风格 */
.cat-op[data-act="cat-lock"]{color:rgba(147,197,253,.85);}
.cat-op[data-act="cat-lock"]:hover{color:#fff;background:rgba(37,99,235,.8);}

/* 解锁 / 设置密码 模态框 */
.modal-narrow{width:min(420px,94vw);}
.modal-box input[type="password"]{
  width:100%;padding:10px 13px;border-radius:9px;
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);
  color:#fff;font-size:15px;margin-bottom:10px;
}
.modal-box input[type="password"]::placeholder{color:rgba(255,255,255,.4);}
.modal-lbl{display:block;font-size:13px;opacity:.8;margin:2px 0 5px;}
.modal-note{
  font-size:12px;line-height:1.6;opacity:.7;margin:6px 0 10px;
  padding:8px 10px;border-radius:8px;background:rgba(239,68,68,.10);
  border-left:3px solid rgba(239,68,68,.55);
}
/* 取消密码保护是危险操作，与主按钮拉开视觉层次 */
.btn-danger-ghost{background:transparent;border:1px solid rgba(239,68,68,.6);color:#fca5a5;box-shadow:none;margin-left:8px;}
.btn-danger-ghost:hover{background:rgba(239,68,68,.18);box-shadow:none;transform:none;}
/* 两按钮并排在窄屏会挤，换行处理 */
.modal-body .btn-primary{margin-top:2px;}

@media (max-width:480px){
  .priv-lock{gap:10px;}
  .priv-ico{font-size:22px;}
  .btn-unlock{width:100%;}
  .btn-danger-ghost{margin-left:0;margin-top:8px;width:100%;}
}

/* ============================================================
   用户等级徽标 / 账号状态标签（后台用户管理）
   ============================================================ */
/* 等级徽标：颜色由 --lv-color 变量注入（PHP 端按等级取色） */
.lv-badge{
  display:inline-block;padding:2px 9px;border-radius:10px;
  font-size:12px;line-height:1.6;white-space:nowrap;
  background:var(--lv-color,#3b82f6);color:#fff;
}
/* 状态标签：正常/暂停/停用三态，用色块 + 文字双编码（不只靠颜色区分，照顾色觉障碍） */
.st-on  {color:#16a34a;font-size:13px;font-weight:600;}
.st-warn{color:#d97706;font-size:13px;font-weight:600;}
.st-off{color:#dc2626;font-size:13px;font-weight:600;}