/* ============================================================
   YG 喵站 · 视觉升级层（在 portal.css 之后加载，整体覆盖）
   设计：樱粉 + 奶油底 + 玻璃质感 + 猫元素 + 微动效
   ============================================================ */

/* ---------------- 全局变量 ---------------- */
:root {
  --pink: #ff7eb6;
  --pink-soft: #ffb3d1;
  --coral: #ff9e7d;
  --mint: #4ade80;
  --sky: #60a5fa;
  --lav: #a78bfa;
  --cream: #fff8fa;
  --ink: #3d2b33;
  --ink-soft: #6b5560;
  --glow: 0 18px 44px rgba(255, 126, 182, .26);
  --glass: rgba(255, 255, 255, .72);
  --radius-xl: 26px;
  --radius-lg: 20px;
  --radius-md: 14px;
}

/* ---------------- 页面底色与氛围 ---------------- */
html[data-theme="light"] body {
  background:
    radial-gradient(1200px 600px at 12% -8%, #ffe4ef 0%, transparent 55%),
    radial-gradient(900px 500px at 92% 8%, #e6f4ff 0%, transparent 50%),
    radial-gradient(800px 600px at 50% 108%, #fff0e2 0%, transparent 55%),
    #fffafc;
}

/* 飘浮爪印层 */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  opacity: .5;
  background-image:
    radial-gradient(circle at 12% 22%, rgba(255,126,182,.13) 0 3px, transparent 3px),
    radial-gradient(circle at 78% 14%, rgba(167,139,250,.12) 0 3px, transparent 3px),
    radial-gradient(circle at 34% 72%, rgba(96,165,250,.11) 0 3px, transparent 3px),
    radial-gradient(circle at 88% 64%, rgba(255,158,125,.12) 0 3px, transparent 3px),
    radial-gradient(circle at 62% 88%, rgba(74,222,128,.10) 0 3px, transparent 3px);
  background-size: 340px 340px, 420px 420px, 380px 380px, 460px 460px, 400px 400px;
  animation: drift 40s linear infinite;
}
@keyframes drift {
  to { background-position: 340px 340px, -420px 420px, 380px -380px, -460px -460px, 400px 400px; }
}

/* ---------------- 滚动条 ---------------- */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #ffc2d8, #ffa8c5);
  border-radius: 6px;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #ff9ec1, #ff86b0); background-clip: content-box; }

/* ============================================================
   门禁页
   ============================================================ */
#viewGate {
  display: grid;
  place-items: center;
  padding: 30px 20px;
  position: relative;
  overflow: hidden;
}

#viewGate .gate {
  position: relative;
  width: min(430px, 100%);
  padding: 54px 34px 32px;
  border-radius: var(--radius-xl);
  border: 1.5px solid rgba(255, 255, 255, .9);
  background:
    radial-gradient(600px circle at 50% -20%, rgba(255, 179, 209, .55), transparent 65%),
    rgba(255, 255, 255, .82);
  backdrop-filter: blur(22px) saturate(160%);
  box-shadow:
    0 30px 70px rgba(255, 126, 182, .22),
    0 8px 20px rgba(120, 80, 100, .08),
    inset 0 1px 0 rgba(255, 255, 255, .95);
  animation: gateIn .6s cubic-bezier(.22, 1, .36, 1);
}
@keyframes gateIn {
  from { opacity: 0; transform: translateY(26px) scale(.96); }
}

/* 猫脸 */
.gate-cat {
  position: absolute;
  top: -42px;
  left: 50%;
  transform: translateX(-50%);
  width: 84px;
  height: 84px;
  display: grid;
  place-items: center;
  font-size: 46px;
  border-radius: 50%;
  background: linear-gradient(145deg, #fff, #ffeef5);
  border: 1.5px solid #fff;
  box-shadow: 0 12px 30px rgba(255, 126, 182, .3), inset 0 -3px 8px rgba(255, 179, 209, .3);
  animation: bob 3.2s ease-in-out infinite;
}
@keyframes bob {
  0%, 100% { transform: translateX(-50%) translateY(0) rotate(-2deg); }
  50% { transform: translateX(-50%) translateY(-7px) rotate(2deg); }
}

/* 猫耳 */
#viewGate .gate::before,
#viewGate .gate::after {
  content: '';
  position: absolute;
  top: -14px;
  width: 34px;
  height: 34px;
  background: linear-gradient(145deg, #ffd0e2, #ffb3d1);
  border-radius: 50% 50% 0 0;
  z-index: -1;
}
#viewGate .gate::before { left: 46px; transform: rotate(-22deg); }
#viewGate .gate::after { right: 46px; transform: rotate(22deg); }

#viewGate .gate-logo {
  text-align: center;
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -.03em;
  background: linear-gradient(120deg, #ff5c9d, #ff9e7d 45%, #a78bfa);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
#viewGate .gate-sub {
  text-align: center;
  margin: 8px 0 26px;
  font-size: 13.5px;
  color: var(--ink-soft);
}

#viewGate .fld input {
  height: 50px;
  padding: 0 18px;
  border-radius: 15px;
  border: 1.5px solid rgba(255, 158, 190, .38);
  background: rgba(255, 255, 255, .85);
  font-size: 15px;
  color: var(--ink);
  transition: all .22s var(--ease);
}
#viewGate .fld input::placeholder { color: #c9a4b3; }
#viewGate .fld input:focus {
  border-color: var(--pink);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255, 126, 182, .16), 0 6px 18px rgba(255, 126, 182, .16);
}

#viewGate .btn.primary {
  height: 50px;
  border-radius: 15px;
  font-size: 15.5px;
  font-weight: 800;
  letter-spacing: .04em;
  background: linear-gradient(120deg, #ff5c9d, #ff8fab 45%, #ff9e7d);
  box-shadow: 0 14px 32px rgba(255, 92, 157, .35), inset 0 1px 0 rgba(255, 255, 255, .5);
  position: relative;
  overflow: hidden;
}
#viewGate .btn.primary::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.45) 50%, transparent 70%);
  transform: translateX(-120%);
  animation: shine 3.4s ease-in-out infinite;
}
@keyframes shine {
  0%, 60% { transform: translateX(-120%); }
  85%, 100% { transform: translateX(120%); }
}
#viewGate .btn.primary:hover { transform: translateY(-2px); box-shadow: 0 18px 40px rgba(255, 92, 157, .45); }

/* ============================================================
   顶栏
   ============================================================ */
#viewPortal .topbar {
  background: rgba(255, 250, 252, .78);
  backdrop-filter: blur(20px) saturate(170%);
  border-bottom: 1px solid rgba(255, 158, 190, .22);
  box-shadow: 0 2px 18px rgba(255, 126, 182, .07);
}
#viewPortal .logo {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -.02em;
  background: linear-gradient(120deg, #ff5c9d, #ff9e7d);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.searchbox {
  background: rgba(255, 255, 255, .8);
  border: 1.5px solid rgba(255, 158, 190, .3);
  border-radius: 13px;
  height: 40px;
}
.searchbox:focus-within {
  border-color: var(--pink);
  box-shadow: 0 0 0 3.5px rgba(255, 126, 182, .15);
}

/* ============================================================
   首页标题
   ============================================================ */
.hero-line h1 {
  font-size: clamp(26px, 3.6vw, 38px);
  font-weight: 900;
  background: linear-gradient(120deg, #3d2b33, #ff5c9d 70%, #a78bfa);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -.03em;
}
.hero-line p { color: #a98a97; font-size: 13.5px; }

/* ============================================================
   分区卡片（首页九宫格）
   ============================================================ */
#viewPortal .cats {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
}

.sec-card {
  --h: 330;
  position: relative;
  padding: 22px 20px 20px;
  border-radius: var(--radius-lg);
  border: 1.5px solid hsla(var(--h), 85%, 78%, .5);
  background:
    radial-gradient(140% 100% at 0% 0%, hsla(var(--h), 95%, 88%, .55), transparent 60%),
    linear-gradient(160deg, rgba(255,255,255,.95), rgba(255,255,255,.72));
  box-shadow: 0 8px 22px hsla(var(--h), 70%, 70%, .16);
  overflow: hidden;
  transition: transform .26s cubic-bezier(.22,1,.36,1), box-shadow .26s var(--ease), border-color .2s;
}
.sec-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.6) 50%, transparent 65%);
  transform: translateX(-130%);
  transition: transform .7s ease;
}
.sec-card:hover::after { transform: translateX(130%); }
.sec-card:hover {
  transform: translateY(-6px) scale(1.025);
  border-color: hsla(var(--h), 85%, 65%, .85);
  box-shadow: 0 20px 44px hsla(var(--h), 70%, 62%, .3);
}

.sec-emoji {
  font-size: 34px;
  filter: drop-shadow(0 4px 8px hsla(var(--h), 70%, 60%, .35));
  transition: transform .26s cubic-bezier(.22,1,.36,1);
}
.sec-card:hover .sec-emoji { transform: scale(1.16) rotate(-7deg); }

.sec-name { font-size: 15px; font-weight: 850; color: #3d2b33; letter-spacing: -.01em; }
.sec-num {
  font-size: 11.5px;
  font-weight: 700;
  color: hsla(var(--h), 55%, 45%, .9);
  background: hsla(var(--h), 90%, 92%, .9);
  padding: 2px 9px;
  border-radius: 20px;
}
.sec-paw { font-size: 15px; opacity: .55; transition: all .26s; }
.sec-card:hover .sec-paw { opacity: 1; transform: rotate(20deg) scale(1.2); }

.sec-card.adult {
  border-color: rgba(255, 92, 157, .35);
  background:
    radial-gradient(140% 100% at 0% 0%, rgba(255, 92, 157, .18), transparent 60%),
    linear-gradient(160deg, rgba(255,255,255,.95), rgba(255,245,249,.8));
}
.sec-18 {
  background: linear-gradient(135deg, #ff2d6f, #ff5c9d);
  box-shadow: 0 4px 12px rgba(255, 45, 111, .35);
  font-size: 10.5px;
  padding: 2px 7px;
}

.sec-card.hack {
  border-color: rgba(167, 139, 250, .4);
  background:
    radial-gradient(140% 100% at 0% 0%, rgba(167, 139, 250, .22), transparent 60%),
    linear-gradient(160deg, rgba(255,255,255,.95), rgba(248,245,255,.8));
}

/* ============================================================
   站点卡片
   ============================================================ */
.lnk {
  padding: 15px 16px;
  border-radius: var(--radius-md);
  border: 1.5px solid rgba(255, 158, 190, .22);
  background: rgba(255, 255, 255, .78);
  backdrop-filter: blur(8px);
  transition: transform .22s cubic-bezier(.22,1,.36,1), box-shadow .22s, border-color .18s, background .18s;
}
.lnk:hover {
  transform: translateY(-4px);
  background: #fff;
  border-color: rgba(255, 126, 182, .55);
  box-shadow: 0 14px 30px rgba(255, 126, 182, .2);
}
.ico {
  width: 42px; height: 42px;
  border-radius: 13px;
  box-shadow: 0 6px 16px hsla(var(--h, 225), 80%, 62%, .32);
  transition: transform .22s cubic-bezier(.22,1,.36,1);
}
.lnk:hover .ico { transform: scale(1.1) rotate(-5deg); }
.ico-rich { background: #fff; border: 1px solid rgba(255,158,190,.3); }
.ico-rich img { padding: 7px; }

.lnk-name { font-size: 14.5px; font-weight: 750; color: #3d2b33; }
.lnk-host { font-size: 11.5px; color: #b391a0; }
.fav-star { font-size: 16px; }
.fav-star:hover { transform: scale(1.35) rotate(-12deg); }

/* ============================================================
   收藏 / 最近
   ============================================================ */
.fav-wrap, .recent-wrap {
  padding: 18px 20px;
  border-radius: var(--radius-lg);
  border: 1.5px dashed rgba(255, 158, 190, .45);
  background: linear-gradient(160deg, rgba(255,255,255,.8), rgba(255,246,250,.6));
}
.fav-head, .recent-head { font-size: 13px; font-weight: 800; color: #d6457e; }
.recent-item {
  border: 1.5px solid rgba(255, 158, 190, .3);
  background: #fff;
  border-radius: 20px;
  padding: 7px 15px;
  font-weight: 600;
  transition: all .2s cubic-bezier(.22,1,.36,1);
}
.recent-item:hover {
  border-color: var(--pink);
  color: #d6457e;
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 8px 18px rgba(255, 126, 182, .2);
}

/* ============================================================
   按钮通用
   ============================================================ */
.btn { border-radius: 12px; font-weight: 650; transition: all .2s cubic-bezier(.22,1,.36,1); }
.btn.primary {
  background: linear-gradient(120deg, #ff5c9d, #ff8fab 55%, #ff9e7d);
  box-shadow: 0 10px 24px rgba(255, 92, 157, .3);
  color: #fff;
}
.btn.primary:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(255, 92, 157, .42); }
.btn.ghost {
  border: 1.5px solid rgba(255, 158, 190, .35);
  background: rgba(255,255,255,.7);
  color: #8a6b78;
}
.btn.ghost:hover {
  border-color: var(--pink);
  color: #d6457e;
  background: #fff;
  transform: translateY(-1px);
}
.btn.danger {
  border: 1.5px solid rgba(255, 92, 138, .4);
  color: #e03e6b;
  background: rgba(255, 255, 255, .7);
}
.btn.danger:hover { background: #fff0f4; border-color: #ff2d6f; transform: translateY(-1px); }

/* ============================================================
   分区详情页
   ============================================================ */
.detail-head h2 {
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -.02em;
  color: #3d2b33;
}
.detail-count {
  font-size: 12px;
  font-weight: 700;
  color: #d6457e;
  background: rgba(255, 158, 190, .16);
  padding: 3px 11px;
  border-radius: 20px;
}

/* ============================================================
   聊天框
   ============================================================ */
.chatbox {
  border-radius: 22px;
  border: 1.5px solid rgba(255, 158, 190, .4);
  background: rgba(255, 252, 253, .92);
  backdrop-filter: blur(24px) saturate(170%);
  box-shadow: 0 24px 60px rgba(255, 126, 182, .25), 0 4px 14px rgba(120,80,100,.08);
}
.chat-head {
  height: 52px;
  border-bottom: 1px solid rgba(255, 158, 190, .22);
  background: linear-gradient(120deg, rgba(255, 228, 239, .9), rgba(255, 248, 250, .8));
}
.chat-title { font-size: 14px; font-weight: 800; color: #3d2b33; }
.chat-dot { background: var(--mint); }
.chat-quota { color: #b391a0; }

.chat-log { height: 320px; padding: 16px 15px 8px; gap: 11px; }
.bubble {
  border-radius: 18px;
  font-size: 13.5px;
  line-height: 1.68;
  padding: 11px 15px;
  position: relative;
}
.msg-row.ai .bubble {
  background: #fff;
  border: 1.5px solid rgba(255, 158, 190, .28);
  border-bottom-left-radius: 6px;
  color: #3d2b33;
  box-shadow: 0 4px 14px rgba(255, 158, 190, .1);
}
.msg-row.me .bubble {
  background: linear-gradient(135deg, #ff5c9d, #ff8fab);
  color: #fff;
  border-bottom-right-radius: 6px;
  box-shadow: 0 8px 20px rgba(255, 92, 157, .3);
  font-weight: 500;
}
.chat-form textarea {
  border-radius: 14px;
  border: 1.5px solid rgba(255, 158, 190, .32);
  background: #fff;
}
.chat-form textarea:focus { border-color: var(--pink); box-shadow: 0 0 0 3.5px rgba(255,126,182,.14); }
.chat-form .btn { border-radius: 13px; }

/* ============================================================
   管理后台
   ============================================================ */
#viewAdmin {
  background:
    radial-gradient(1000px 500px at 8% -6%, rgba(108,140,255,.14), transparent 55%),
    radial-gradient(900px 500px at 95% 4%, rgba(167,139,250,.12), transparent 50%),
    #0b0f18;
  min-height: 100vh;
}

#viewAdmin .topbar {
  background: rgba(11, 15, 24, .82);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 4px 24px rgba(0, 0, 0, .3);
}

#viewAdmin .logo {
  background: linear-gradient(120deg, #6c8cff, #a78bfa);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.atabs {
  gap: 5px;
  padding: 4px;
  background: rgba(255, 255, 255, .04);
  border-radius: 13px;
  border: 1px solid rgba(255, 255, 255, .07);
}
.atab {
  border-radius: 10px;
  font-weight: 650;
  padding: 7px 15px;
}
.atab.on {
  background: linear-gradient(135deg, rgba(108,140,255,.9), rgba(167,139,250,.85));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 6px 18px rgba(108, 140, 255, .4);
}

.sec-title h2 {
  font-size: 17px;
  font-weight: 850;
  letter-spacing: -.02em;
  background: linear-gradient(120deg, #e9eef8, #a8bcff);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.hint-box {
  border: 1px solid rgba(108, 140, 255, .25);
  border-left: 3px solid #6c8cff;
  background: linear-gradient(100deg, rgba(108,140,255,.1), rgba(108,140,255,.03));
  border-radius: 12px;
  backdrop-filter: blur(8px);
}

/* 统计卡 */
#viewAdmin .stats {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 14px;
}
#viewAdmin .stat {
  position: relative;
  padding: 20px 20px 18px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .09);
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(108, 140, 255, .16), transparent 62%),
    rgba(255, 255, 255, .04);
  overflow: hidden;
  transition: transform .22s var(--ease), border-color .2s, box-shadow .22s;
}
#viewAdmin .stat:hover {
  transform: translateY(-3px);
  border-color: rgba(108, 140, 255, .4);
  box-shadow: 0 14px 32px rgba(0, 0, 0, .35);
}
#viewAdmin .stat b {
  font-size: 30px;
  font-weight: 900;
  background: linear-gradient(135deg, #fff, #a8bcff);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
#viewAdmin .stat span { font-size: 12px; color: #6a7890; font-weight: 600; }
#viewAdmin .stat.alert b {
  background: linear-gradient(135deg, #ff6b81, #ffb3c1);
  -webkit-background-clip: text;
  background-clip: text;
}

/* 表格 */
#viewAdmin .tablewrap {
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .08);
  background: rgba(255, 255, 255, .03);
  overflow: hidden;
}
#viewAdmin .tbl thead th {
  background: rgba(255, 255, 255, .05);
  font-size: 11.5px;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: #6a7890;
  padding: 13px 15px;
}
#viewAdmin .tbl td { padding: 12px 15px; }
#viewAdmin .tbl tbody tr { transition: background-color .15s; }
#viewAdmin .tbl tbody tr:hover { background: rgba(108, 140, 255, .08); }
#viewAdmin .tbl .t-name { font-weight: 700; color: #e9eef8; }

/* 站点管理面板 */
#viewAdmin .sa-box {
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .09);
  background: rgba(255, 255, 255, .03);
  overflow: hidden;
}
#viewAdmin .sa-box-head {
  background: rgba(255, 255, 255, .04);
  font-weight: 750;
  letter-spacing: .02em;
  color: #98a6bd;
}
#viewAdmin .sa-sec { transition: all .16s var(--ease); }
#viewAdmin .sa-sec:hover { background: rgba(108, 140, 255, .1); }
#viewAdmin .sa-sec.active {
  background: linear-gradient(90deg, rgba(108,140,255,.22), rgba(108,140,255,.06));
  border-left: 3px solid #6c8cff;
  color: #fff;
}

/* 图表卡 */
#viewAdmin .chart-card {
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .08);
  background:
    radial-gradient(120% 100% at 50% 0%, rgba(108, 140, 255, .1), transparent 65%),
    rgba(255, 255, 255, .03);
}
#viewAdmin .chart-card h3 {
  font-weight: 750;
  letter-spacing: .04em;
  color: #98a6bd;
}

/* 输入框 */
#viewAdmin .rc-path {
  border-radius: 11px;
  border: 1px solid rgba(255, 255, 255, .1);
  background: rgba(255, 255, 255, .05);
  transition: all .2s;
}
#viewAdmin .rc-path:focus {
  border-color: #6c8cff;
  box-shadow: 0 0 0 3px rgba(108, 140, 255, .16);
  background: rgba(108, 140, 255, .06);
}

/* ============================================================
   名言滚动条
   ============================================================ */
.slogan-bar {
  background: linear-gradient(90deg, #d6004f, #ff2d6f 30%, #ff5c9d 50%, #ff2d6f 70%, #d6004f);
  box-shadow: 0 3px 16px rgba(214, 0, 79, .35);
}
.slogan-track { font-weight: 700; }

/* ============================================================
   页脚 / 下载卡
   ============================================================ */
.foot {
  border-top: 1px solid rgba(255, 158, 190, .2);
  color: #b391a0;
}
.dl-card {
  border-radius: var(--radius-lg);
  border: 1.5px solid rgba(255, 158, 190, .28);
  background:
    radial-gradient(600px circle at 0% 0%, rgba(255, 179, 209, .3), transparent 60%),
    rgba(255, 255, 255, .8);
  backdrop-filter: blur(10px);
}
.dl-icon {
  background: linear-gradient(135deg, #ffb3d1, #ff5c9d);
  box-shadow: 0 10px 24px rgba(255, 92, 157, .3);
}

/* ============================================================
   深色主题（主界面）
   ============================================================ */
html[data-theme="dark"] body {
  background:
    radial-gradient(1100px 600px at 10% -8%, rgba(255, 92, 157, .12), transparent 55%),
    radial-gradient(900px 500px at 92% 6%, rgba(108, 140, 255, .12), transparent 50%),
    #0a0910;
}
html[data-theme="dark"] #viewPortal .topbar {
  background: rgba(12, 10, 18, .85);
  border-bottom-color: rgba(255, 255, 255, .07);
}
html[data-theme="dark"] .sec-card {
  background:
    radial-gradient(140% 100% at 0% 0%, hsla(var(--h), 80%, 30%, .5), transparent 60%),
    linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border-color: hsla(var(--h), 70%, 45%, .4);
}
html[data-theme="dark"] .sec-name { color: #e9eef8; }
html[data-theme="dark"] .sec-num {
  color: hsla(var(--h), 80%, 78%, .95);
  background: hsla(var(--h), 60%, 30%, .45);
}
html[data-theme="dark"] .lnk {
  background: rgba(255, 255, 255, .045);
  border-color: rgba(255, 255, 255, .08);
}
html[data-theme="dark"] .lnk:hover {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 126, 182, .5);
}
html[data-theme="dark"] .lnk-name { color: #e9eef8; }
html[data-theme="dark"] .hero-line h1 {
  background: linear-gradient(120deg, #e9eef8, #ff7eb6 70%, #a78bfa);
  -webkit-background-clip: text;
  background-clip: text;
}
html[data-theme="dark"] .fav-wrap,
html[data-theme="dark"] .recent-wrap {
  background: rgba(255, 255, 255, .04);
  border-color: rgba(255, 255, 255, .1);
}
html[data-theme="dark"] .recent-item {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .1);
  color: #b8c4d8;
}
html[data-theme="dark"] .chatbox {
  background: rgba(18, 16, 24, .94);
  border-color: rgba(255, 255, 255, .1);
}
html[data-theme="dark"] .chat-head {
  background: linear-gradient(120deg, rgba(255, 92, 157, .12), rgba(255, 255, 255, .03));
}
html[data-theme="dark"] .chat-title { color: #e9eef8; }
html[data-theme="dark"] .msg-row.ai .bubble {
  background: rgba(255, 255, 255, .07);
  border-color: rgba(255, 255, 255, .1);
  color: #e2e8f4;
}
html[data-theme="dark"] .chat-form textarea {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .1);
  color: #e9eef8;
}
html[data-theme="dark"] .dl-card {
  background: rgba(255, 255, 255, .04);
  border-color: rgba(255, 255, 255, .09);
}

/* ============================================================
   响应式微调
   ============================================================ */
@media (max-width: 720px) {
  #viewPortal .cats { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
  .sec-card { padding: 17px 15px 15px; }
  .sec-emoji { font-size: 27px; }
  .sec-name { font-size: 13.5px; }
  #viewGate .gate { padding: 48px 22px 26px; }
}

/* ---------------- 统计卡图标 ---------------- */
#viewAdmin .stat-ico {
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 20px;
  opacity: .55;
  filter: grayscale(.2);
  transition: all .25s var(--ease);
}
#viewAdmin .stat:hover .stat-ico { opacity: 1; transform: scale(1.15) rotate(6deg); }

/* ---------------- 分区卡入场 ---------------- */
@keyframes cardIn {
  from { opacity: 0; transform: translateY(16px) scale(.97); }
}
.sec-card { animation: cardIn .45s cubic-bezier(.22,1,.36,1) backwards; }
.sec-card:nth-child(1) { animation-delay: .01s; }
.sec-card:nth-child(2) { animation-delay: .03s; }
.sec-card:nth-child(3) { animation-delay: .05s; }
.sec-card:nth-child(4) { animation-delay: .07s; }
.sec-card:nth-child(5) { animation-delay: .09s; }
.sec-card:nth-child(6) { animation-delay: .11s; }
.sec-card:nth-child(7) { animation-delay: .13s; }
.sec-card:nth-child(8) { animation-delay: .15s; }
.sec-card:nth-child(9) { animation-delay: .17s; }
.sec-card:nth-child(10) { animation-delay: .19s; }
.sec-card:nth-child(11) { animation-delay: .21s; }
.sec-card:nth-child(12) { animation-delay: .23s; }

/* 站点卡入场 */
@keyframes linkIn {
  from { opacity: 0; transform: translateY(10px); }
}
.lnk { animation: linkIn .35s cubic-bezier(.22,1,.36,1) backwards; }
.lnk:nth-child(1) { animation-delay: .01s; }
.lnk:nth-child(2) { animation-delay: .03s; }
.lnk:nth-child(3) { animation-delay: .05s; }
.lnk:nth-child(4) { animation-delay: .07s; }
.lnk:nth-child(5) { animation-delay: .09s; }
.lnk:nth-child(6) { animation-delay: .11s; }
.lnk:nth-child(7) { animation-delay: .13s; }
.lnk:nth-child(8) { animation-delay: .15s; }

/* ============================================================
   矢量图标系统
   ============================================================ */
.i {
  width: 1em;
  height: 1em;
  vertical-align: -0.14em;
  flex: 0 0 auto;
  pointer-events: none;
}

/* 门禁猫脸 */
.gate-cat-svg {
  width: 48px;
  height: 48px;
  color: #ff5c9d;
}
#viewGate .gate-cat {
  background: linear-gradient(150deg, #fff, #ffe9f2);
  border-color: #fff;
}

/* Logo 猫爪 */
.logo-paw {
  width: 17px;
  height: 17px;
  color: #ff5c9d;
  vertical-align: -2px;
}
#viewAdmin .logo-paw { color: #8aa4ff; }

/* 分区图标 */
.sec-svg {
  width: 30px;
  height: 30px;
  color: hsl(var(--h), 68%, 52%);
  transition: transform .26s cubic-bezier(.22, 1, .36, 1), color .2s;
}
.sec-card:hover .sec-svg {
  transform: scale(1.12) rotate(-6deg);
  color: hsl(var(--h), 78%, 46%);
}
html[data-theme="dark"] .sec-svg { color: hsl(var(--h), 80%, 70%); }

.sec-emoji {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: hsla(var(--h), 90%, 96%, .9);
  border: 1px solid hsla(var(--h), 70%, 82%, .7);
  filter: none;
}
html[data-theme="dark"] .sec-emoji {
  background: hsla(var(--h), 60%, 22%, .6);
  border-color: hsla(var(--h), 60%, 40%, .5);
}
.sec-card:hover .sec-emoji { transform: none; }
.sec-card:hover .sec-emoji .sec-svg { transform: scale(1.14) rotate(-6deg); }
.sec-paw { display: none; }

/* 统计卡图标 */
#viewAdmin .stat-ico {
  position: absolute;
  top: 15px;
  right: 16px;
  opacity: .45;
}
#viewAdmin .stat-ico svg {
  width: 19px;
  height: 19px;
  color: #8aa4ff;
}
#viewAdmin .stat:hover .stat-ico { opacity: 1; }
#viewAdmin .stat:hover .stat-ico svg { transform: scale(1.15); }

/* 详情页标题图标 */
.detail-head h2 {
  display: flex;
  align-items: center;
  gap: 9px;
}
.detail-head h2 .sec-svg {
  width: 24px;
  height: 24px;
  color: hsl(var(--h, 330), 70%, 55%);
}

/* 按钮里的图标 */
.btn .i { width: 15px; height: 15px; }
.btn.primary .i { opacity: .92; }

/* ============================================================
   页面过渡（View Transitions）
   ============================================================ */

}
}

/* 详情页内容依次浮现 */
#sectionDetail .detail-head {
  animation: headIn .42s cubic-bezier(.22, 1, .36, 1) both;
}
@keyframes headIn {
  from { opacity: 0; transform: translateY(-10px); }
}
#sectionDetail .grid .lnk {
  animation: linkIn2 .42s cubic-bezier(.22, 1, .36, 1) both;
}
@keyframes linkIn2 {
  from { opacity: 0; transform: translateY(14px) scale(.97); }
}
#sectionDetail .grid .lnk:nth-child(1) { animation-delay: .04s; }
#sectionDetail .grid .lnk:nth-child(2) { animation-delay: .07s; }
#sectionDetail .grid .lnk:nth-child(3) { animation-delay: .10s; }
#sectionDetail .grid .lnk:nth-child(4) { animation-delay: .13s; }
#sectionDetail .grid .lnk:nth-child(5) { animation-delay: .16s; }
#sectionDetail .grid .lnk:nth-child(6) { animation-delay: .19s; }
#sectionDetail .grid .lnk:nth-child(7) { animation-delay: .22s; }
#sectionDetail .grid .lnk:nth-child(8) { animation-delay: .25s; }
#sectionDetail .grid .lnk:nth-child(n+9) { animation-delay: .28s; }

/* ---------------- 新图标适配 ---------------- */
.go-svg {
  width: 15px;
  height: 15px;
  color: #c9a4b3;
  transition: transform .22s cubic-bezier(.22,1,.36,1), color .2s;
}
.lnk:hover .go-svg { color: #ff5c9d; transform: translateX(3px); }

.i.rot90 { transform: rotate(90deg); }
.grip-i { width: 13px; height: 13px; color: #5b6b85; }
.file-i { width: 13px; height: 13px; color: #7c8ba3; margin-right: 5px; vertical-align: -2px; }

.blocked-icon svg { width: 46px; height: 46px; color: #ff5c8a; }
.age-cat svg { width: 54px; height: 54px; color: #ff5c9d; }
.rc-x svg { width: 15px; height: 15px; }

/* 门禁按钮不再需要 paw 后缀 */
#viewGate .btn.primary { letter-spacing: .08em; }

/* 详情页返回按钮 */
#backBtn2 .i, #backBtn .i { width: 14px; height: 14px; }

/* tab 图标 */
.atab .i { width: 14px; height: 14px; margin-right: -2px; }

/* ============================================================
   Duotone 图标 + 分区浮标 + 果冻动画
   ============================================================ */

/* 分区浮标：渐变容器 + 白色双色调图标 */
.sec-emoji {
  width: 54px;
  height: 54px;
  border-radius: 17px;
  display: grid;
  place-items: center;
  background:
    linear-gradient(145deg,
      hsl(var(--h), 88%, 68%) 0%,
      hsl(calc(var(--h) + 28), 86%, 60%) 100%);
  border: none;
  box-shadow:
    0 10px 22px hsla(var(--h), 75%, 58%, .38),
    0 2px 6px hsla(var(--h), 70%, 50%, .25),
    inset 0 1.5px 0 rgba(255, 255, 255, .55);
  position: relative;
  overflow: hidden;
  transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), box-shadow .3s;
}
.sec-emoji::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 255, 255, .45), transparent 65%);
  pointer-events: none;
}
.sec-svg {
  width: 30px;
  height: 30px;
  color: #fff;
  filter: drop-shadow(0 1.5px 3px rgba(0, 0, 0, .18));
  position: relative;
  z-index: 1;
  transition: transform .3s cubic-bezier(.34, 1.56, .64, 1);
}
.sec-card:hover .sec-emoji {
  transform: translateY(-2px) scale(1.06) rotate(-3deg);
  box-shadow:
    0 16px 30px hsla(var(--h), 78%, 55%, .48),
    0 3px 8px hsla(var(--h), 70%, 50%, .3),
    inset 0 1.5px 0 rgba(255, 255, 255, .65);
}
.sec-card:hover .sec-svg { transform: scale(1.06); }

/* 详情页标题图标 */
.detail-head h2 .sec-svg {
  width: 26px;
  height: 26px;
  color: hsl(var(--h, 330), 75%, 58%);
  filter: none;
}

/* 管理后台分区列表图标 */
#viewAdmin .sa-sec .sec-svg {
  width: 18px;
  height: 18px;
  color: #8aa4ff;
  filter: none;
}
#viewAdmin .sa-sec .emoji {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: rgba(108, 140, 255, .12);
}

/* ============================================================
   果冻滑入
   ============================================================ */
.jelly {
  /* 默认完全可见：即使 JS/观察器失效也不会空白 */
  opacity: 1;
  transform: none;
}
.jelly.in {
  animation: jellyIn .78s cubic-bezier(.34, 1.56, .64, 1) both;
}
@keyframes jellyIn {
  0% {
    opacity: 0;
    transform: translateY(46px) scale(.88) rotate(-1.6deg);
  }
  52% {
    opacity: 1;
    transform: translateY(-9px) scale(1.035) rotate(.6deg);
  }
  74% {
    transform: translateY(4px) scale(.985) rotate(-.25deg);
  }
  88% {
    transform: translateY(-1.5px) scale(1.004);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1) rotate(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .jelly, .jelly.in { opacity: 1 !important; transform: none !important; animation: none !important; }
}

/* 收藏星 SVG */
.fav-star svg {
  width: 17px;
  height: 17px;
  display: block;
  transition: transform .2s cubic-bezier(.34, 1.56, .64, 1), fill .2s;
}
.fav-star.on svg { fill: #ffb703; stroke: #ffb703; }
.fav-star:hover svg { transform: scale(1.25) rotate(-10deg); }

/* 名言栏右侧固定链接（避免整条误触） */
.slogan-bar {
  display: flex;
  align-items: center;
  gap: 0;
  cursor: default;
  position: relative;
  padding-right: 96px;
}
.slogan-bar .slogan-track {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.slogan-link {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  pointer-events: auto;
  cursor: pointer;
  margin-left: 10px;
  padding: 0 12px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  border-radius: 7px;
  background: rgba(255, 255, 255, .18);
  color: #fff !important;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  text-decoration: none;
  transition: background .18s;
}
.slogan-link:hover { background: rgba(255, 255, 255, .32); }

/* ============================================================
   站点图标：首字母打底 + favicon 渐进覆盖
   ============================================================ */
.lnk .ico {
  position: relative;
  overflow: hidden;
  border-radius: 13px;
}
.ico-letter {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 16px;
  font-weight: 850;
  font-style: normal;
  color: rgba(255, 255, 255, .96);
  text-shadow: 0 1px 3px rgba(0, 0, 0, .18);
  z-index: 1;
}
.ico-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 8px;
  background: #fff;
  border-radius: inherit;
  opacity: 0;
  transform: scale(.8);
  transition: opacity .28s var(--ease), transform .28s cubic-bezier(.34, 1.56, .64, 1);
  z-index: 2;
}
.lnk .ico.has-img .ico-img {
  opacity: 1;
  transform: scale(1);
}
html[data-theme="dark"] .ico-img { background: #f7f7fa; }

/* ============================================================
   AI 聊天锁（未安装客户端时）
   ============================================================ */
.chatbox { position: relative; }

.chat-lock {
  position: absolute;
  left: 0;
  right: 0;
  top: 52px;
  bottom: 0;
  z-index: 12;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 24px;
  text-align: center;
  background: rgba(255, 252, 253, .93);
  backdrop-filter: blur(8px);
  border-radius: 0 0 20px 20px;
  animation: lockIn .26s var(--ease);
}
@keyframes lockIn { from { opacity: 0; } }

.chat-lock-ico {
  width: 40px;
  height: 40px;
  color: #ff5c9d;
  margin-bottom: 4px;
  filter: drop-shadow(0 6px 14px rgba(255, 92, 157, .3));
}
.chat-lock-t {
  font-size: 14.5px;
  font-weight: 850;
  color: #3d2b33;
  letter-spacing: -.01em;
}
.chat-lock-s {
  font-size: 12px;
  color: #a98a97;
  margin-bottom: 8px;
}
.chat-lock .btn {
  padding: 9px 20px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 750;
}

.chatbox.chat-locked .chat-log,
.chatbox.chat-locked .chat-form { pointer-events: none; }

html[data-theme="dark"] .chat-lock { background: rgba(20, 17, 26, .94); }
html[data-theme="dark"] .chat-lock-t { color: #e9eef8; }

/* 待审核徽章 */
.badge.warn {
  background: rgba(255, 183, 3, .18);
  color: #b8860b;
  border: 1px solid rgba(255, 183, 3, .4);
  font-weight: 700;
}

/* ============================================================
   动效增强
   ============================================================ */

/* 分区卡 3D 倾斜（JS 设 transform，这里只补过渡和光影）
   ★ 不给 .sec-card 常驻 will-change：111 张卡 = 111 个合成层，显存直接爆
   ★ preserve-3d 也去掉：JS 用的是单层 perspective()，不需要 3D 上下文 */
.sec-card {
  transition: transform .18s cubic-bezier(.22,1,.36,1),
              box-shadow .3s cubic-bezier(.22,1,.36,1),
              border-color .2s;
}
.sec-card:hover { box-shadow: 0 22px 48px hsla(var(--h), 70%, 58%, .34); }

/* 卡片内部元素随倾斜产生视差 */
.sec-card .sec-emoji,
.sec-card .sec-name,
.sec-card .sec-num {
  transform: translateZ(1px);
  transition: transform .3s cubic-bezier(.34,1.56,.64,1);
}
.sec-card:hover .sec-emoji { transform: translateZ(24px) scale(1.08) rotate(-5deg); }
.sec-card:hover .sec-name { transform: translateZ(12px); }

/* 站点卡：光泽扫过 */
.lnk {
  position: relative;
  overflow: hidden;
}
.lnk::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -60%;
  width: 45%;
  height: 200%;
  background: linear-gradient(100deg,
    transparent 0%,
    rgba(255,255,255,.55) 50%,
    transparent 100%);
  transform: rotate(18deg);
  opacity: 0;
  pointer-events: none;
  transition: none;
}
.lnk:hover::after {
  opacity: 1;
  animation: lnkSheen .62s cubic-bezier(.4, 0, .2, 1);
}
@keyframes lnkSheen {
  from { left: -60%; }
  to   { left: 130%; }
}

/* 图标加载完成的弹入 */
.ico.has-img .ico-img {
  animation: icoPop .4s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes icoPop {
  from { opacity: 0; transform: scale(.6) rotate(-8deg); }
  60%  { opacity: 1; transform: scale(1.06) rotate(2deg); }
  to   { opacity: 1; transform: scale(1) rotate(0); }
}

/* 详情页标题滑入 */
.detail-head h2 {
  animation: titleIn .46s cubic-bezier(.22,1,.36,1) both;
}
@keyframes titleIn {
  from { opacity: 0; transform: translateX(-14px); }
}

/* 返回按钮悬停回弹 */
#backBtn2:hover, #backBtn:hover {
  transform: translateX(-3px);
}

/* 装饰：卡片右上角光斑呼吸 */
.sec-card::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -30%;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: radial-gradient(circle, hsla(var(--h), 95%, 75%, .5), transparent 70%);
  opacity: 0;
  transition: opacity .4s;
  pointer-events: none;
}
.sec-card:hover::before { opacity: 1; animation: glowPulse 2.4s ease-in-out infinite; }
@keyframes glowPulse {
  0%, 100% { transform: scale(1); opacity: .55; }
  50%      { transform: scale(1.18); opacity: .8; }
}

@media (prefers-reduced-motion: reduce) {
  .sec-card, .sec-card:hover,
  .lnk::after, .ico.has-img .ico-img,
  .detail-head h2 { animation: none !important; transition: none !important; transform: none !important; }
}

/* ============================================================
   特效加强：聚光灯 / 涟漪 / 全息 / 磁性
   ============================================================ */

/* 1. 鼠标聚光灯 */
#spotlight {
  position: fixed;
  top: 0; left: 0;
  width: 620px; height: 620px;
  margin: -310px 0 0 -310px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  background: radial-gradient(circle,
      rgba(255, 126, 182, .13) 0%,
      rgba(167, 139, 250, .09) 38%,
      transparent 68%);
  will-change: transform;
  transition: opacity .5s ease;
}
#spotlight.on { opacity: 1; }

/* 2. 点击涟漪 */
.ripple {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(255,255,255,.85) 0%, rgba(255,255,255,0) 68%);
  transform: scale(0);
  opacity: .95;
  animation: rippleOut .62s cubic-bezier(.2,.7,.3,1) forwards;
  z-index: 5;
}
@keyframes rippleOut {
  to { transform: scale(1); opacity: 0; }
}
.sec-card, .lnk, .btn, .recent-item, .tb-chip { overflow: hidden; }

/* 3. 卡片全息光斑（跟随鼠标） */
.sec-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  transition: opacity .32s;
  background:
    radial-gradient(220px circle at var(--mx, 50%) var(--my, 50%),
      rgba(255,255,255,.55) 0%,
      hsla(var(--h), 95%, 72%, .34) 26%,
      transparent 58%);
  z-index: 3;
}
.sec-card:hover::before { opacity: 1; }

/* 卡片 content 压在全息层之上 */
.sec-card > * { position: relative; z-index: 4; }

/* 4. 磁性按钮 */
.btn {
  will-change: transform;
  transition: transform .18s cubic-bezier(.22,1,.36,1),
              box-shadow .22s,
              background-position .6s;
}

/* 5. 站点卡：悬停时图标容器光晕 */
.lnk:hover .ico {
  box-shadow:
    0 10px 24px hsla(var(--h, 225), 85%, 60%, .42),
    0 0 0 3px hsla(var(--h, 225), 90%, 75%, .28);
}

/* 6. 分区卡悬停时底部光条 */
.sec-card .sec-bar {
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: 0;
  height: 2.5px;
  border-radius: 2px 2px 0 0;
  background: linear-gradient(90deg, transparent, hsl(var(--h), 90%, 62%), transparent);
  transform: scaleX(0);
  transition: transform .38s cubic-bezier(.34,1.56,.64,1);
  z-index: 4;
}
.sec-card:hover .sec-bar { transform: scaleX(1); }

@media (prefers-reduced-motion: reduce) {
  #spotlight, .ripple, .sec-card::before, .sec-card .sec-bar { display: none !important; }
}

/* 顶栏「屏蔽 PoKI」入口 */
.btn.poki-entry {
  border-color: rgba(255, 92, 157, .45) !important;
  color: #d6457e !important;
  background: rgba(255, 246, 250, .9) !important;
  position: relative;
}
.btn.poki-entry::after {
  content: '';
  position: absolute;
  top: 4px;
  right: 4px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ff2d6f;
  box-shadow: 0 0 0 0 rgba(255, 45, 111, .6);
  animation: pokiDot 2s ease-out infinite;
}
@keyframes pokiDot {
  0%   { box-shadow: 0 0 0 0 rgba(255, 45, 111, .6); }
  70%  { box-shadow: 0 0 0 7px rgba(255, 45, 111, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 45, 111, 0); }
}
.btn.poki-entry:hover {
  background: #fff0f5 !important;
  border-color: #ff2d6f !important;
}

/* 顶栏按钮适配：窄屏时允许换行，不挤丢 */
#viewPortal .topbar {
  flex-wrap: wrap;
  row-gap: 8px;
}
#viewPortal .topbar .btn {
  padding: 7px 13px;
  font-size: 12.5px;
  white-space: nowrap;
}
@media (max-width: 720px) {
  #viewPortal .topbar .searchbox {
    order: 9;
    flex-basis: 100%;
  }
  #viewPortal .topbar .btn {
    padding: 6px 10px;
    font-size: 12px;
  }
}


/* ============================================================
   性能模式（no-fx）—— 关掉全部动画/滤镜/重阴影
   ============================================================ */
body.no-fx *,
body.no-fx *::before,
body.no-fx *::after {
  animation: none !important;
  transition: none !important;
}
body.no-fx * {
  will-change: auto !important;
}

/* 干掉的装饰层 */
body.no-fx #spotlight,
body.no-fx .blob,
body.no-fx .jelly::before,
body.no-fx .sec-card::before,
body.no-fx .sec-card::after,
body.no-fx .lnk::after,
body.no-fx .btn::after,
body.no-fx .slogan-bar .slogan-link::after {
  display: none !important;
}

/* jelly 直接可见 */
body.no-fx .jelly {
  opacity: 1 !important;
  transform: none !important;
}

/* 干掉 backdrop-filter（最耗 GPU 的一项） */
body.no-fx #viewPortal .topbar,
body.no-fx .chatbox,
body.no-fx .tb-panel,
body.no-fx .tb-modal,
body.no-fx .dl-card,
body.no-fx .hint-box,
body.no-fx #viewGate .gate,
body.no-fx .searchbox {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.no-fx #viewPortal .topbar { background: #fffafc !important; }
body.no-fx .chatbox { background: #fffafc !important; }
body.no-fx .tb-panel { background: #fff !important; }

/* 阴影收敛成极轻一层 */
body.no-fx .sec-card,
body.no-fx .lnk,
body.no-fx .btn,
body.no-fx .stat,
body.no-fx .chart-card,
body.no-fx .sa-box,
body.no-fx .tablewrap {
  box-shadow: none !important;
  border-color: rgba(0,0,0,.08) !important;
}

/* hover 不再位移/缩放 */
body.no-fx .sec-card:hover,
body.no-fx .lnk:hover,
body.no-fx .btn:hover,
body.no-fx .recent-item:hover {
  transform: none !important;
  box-shadow: none !important;
}

/* 背景简化成纯色渐变（去掉径向多层） */
body.no-fx {
  background: #fffafc !important;
}
body.no-fx::before { display: none !important; }

html[data-theme="dark"] body.no-fx {
  background: #0a0910 !important;
}
html[data-theme="dark"] body.no-fx #viewPortal .topbar { background: #12101a !important; }
html[data-theme="dark"] body.no-fx .chatbox { background: #12101a !important; }
html[data-theme="dark"] body.no-fx .tb-panel { background: #12101a !important; }

/* 开关按钮状态 */
#fxBtn.off {
  border-color: rgba(0,0,0,.12) !important;
  color: #9aa5b8 !important;
  background: rgba(0,0,0,.03) !important;
}
#fxBtn.off::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 4px;
  border-radius: 50%;
  background: #9aa5b8;
  vertical-align: 1px;
}

/* boot 遮罩纯 CSS 自动隐藏 —— 即使 JS 全挂也不会卡住 */
@keyframes bootAutoHide {
  to { opacity: 0; visibility: hidden; pointer-events: none; }
}
#boot.gone { animation: none !important; opacity: 0 !important; visibility: hidden !important; }
.boot-ver {
  font-size: 10.5px;
  opacity: .45;
  font-family: ui-monospace, monospace;
  letter-spacing: .04em;
}

/* ============================================================
   名言滚动条豁免：即使开了 no-fx 也保持滚动
   （这条必须放在 body.no-fx 规则之后才能覆盖）
   ============================================================ */
body.no-fx .slogan-track,
body.no-fx .slogan-bar .slogan-track {
  animation: marquee 150s linear infinite !important;
  transition: none !important;
}
body.no-fx .slogan-track span::before {
  animation: none !important;
}
@media (prefers-reduced-motion: reduce) {
  .slogan-track,
  body.no-fx .slogan-track {
    animation: marquee 150s linear infinite !important;
  }
}


/* ============================================================
   Linux 酷炫主题（html[data-style="linux"]）
   终端风：纯黑 + 霓虹绿 + 方角 + 等宽字体
   ============================================================ */
html[data-style="linux"] {
  --bg: #050505;
  --ink: #00ff41;
  --mute: rgba(0, 255, 65, .55);
  --line: rgba(0, 255, 65, .22);
  --line2: rgba(0, 255, 65, .38);
  --accent: #00ff41;
  --accent2: #00e5ff;
}

html[data-style="linux"] body {
  font-family: ui-monospace, "Cascadia Mono", Consolas, "Courier New", monospace;
  background: #050505 !important;
  color: #00ff41;
}

/* 扫描线 */
html[data-style="linux"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg, rgba(0, 255, 65, .04) 0 1px, transparent 1px 3px);
  opacity: .45;
}

/* 干掉粉色光斑/聚光灯 */
html[data-style="linux"] .blob,
html[data-style="linux"] #spotlight {
  display: none !important;
}

/* ---------- 顶栏 ---------- */
html[data-style="linux"] #viewPortal .topbar {
  background: rgba(5, 8, 6, .94) !important;
  border: 1px solid rgba(0, 255, 65, .28) !important;
  border-radius: 4px !important;
  backdrop-filter: none !important;
  box-shadow: 0 0 24px rgba(0, 255, 65, .1) !important;
}
html[data-style="linux"] .logo {
  color: #00ff41 !important;
  text-shadow: 0 0 14px rgba(0, 255, 65, .6) !important;
  letter-spacing: .05em;
}
html[data-style="linux"] .logo span { color: #00e5ff !important; }
html[data-style="linux"] .logo-paw { display: none !important; }

html[data-style="linux"] .searchbox {
  background: rgba(0, 255, 65, .04) !important;
  border: 1px solid rgba(0, 255, 65, .3) !important;
  border-radius: 3px !important;
  backdrop-filter: none !important;
}
html[data-style="linux"] .searchbox input {
  color: #b6ffce !important;
  font-family: inherit !important;
  caret-color: #00ff41;
}
html[data-style="linux"] .searchbox input::placeholder {
  color: rgba(0, 255, 65, .28) !important;
}

/* ---------- 按钮 ---------- */
html[data-style="linux"] .btn {
  border-radius: 3px !important;
  border: 1px solid rgba(0, 255, 65, .42) !important;
  background: rgba(0, 255, 65, .06) !important;
  color: #00ff41 !important;
  font-family: inherit !important;
  letter-spacing: .06em;
  box-shadow: none !important;
  text-shadow: 0 0 8px rgba(0, 255, 65, .4);
}
html[data-style="linux"] .btn::after,
html[data-style="linux"] .btn::before { display: none !important; }
html[data-style="linux"] .btn:hover {
  transform: none !important;
  background: rgba(0, 255, 65, .16) !important;
  border-color: #00ff41 !important;
  box-shadow: 0 0 20px rgba(0, 255, 65, .28) !important;
  text-shadow: 0 0 14px rgba(0, 255, 65, .9);
}
html[data-style="linux"] .btn.primary,
html[data-style="linux"] .btn.poki-entry {
  background: rgba(0, 255, 65, .18) !important;
  border-color: #00ff41 !important;
  color: #00ff41 !important;
}
html[data-style="linux"] .btn.poki-entry::after { display: none !important; }

/* ---------- 分区卡片 ---------- */
html[data-style="linux"] .sec-card {
  border-radius: 3px !important;
  border: 1px solid rgba(0, 255, 65, .28) !important;
  background: rgba(0, 255, 65, .035) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
html[data-style="linux"] .sec-card::before,
html[data-style="linux"] .sec-card::after { display: none !important; }
html[data-style="linux"] .sec-card:hover {
  transform: none !important;
  border-color: #00ff41 !important;
  background: rgba(0, 255, 65, .09) !important;
  box-shadow: 0 0 24px rgba(0, 255, 65, .2), inset 0 0 30px rgba(0, 255, 65, .05) !important;
}
html[data-style="linux"] .sec-card .sec-name,
html[data-style="linux"] .sec-card b {
  color: #00ff41 !important;
  text-shadow: 0 0 10px rgba(0, 255, 65, .45);
}
html[data-style="linux"] .sec-card .sec-count,
html[data-style="linux"] .sec-card .sec-sub {
  color: rgba(0, 255, 65, .48) !important;
}

/* ---------- 链接卡片 ---------- */
html[data-style="linux"] .lnk {
  border-radius: 3px !important;
  border: 1px solid rgba(0, 255, 65, .2) !important;
  background: rgba(0, 255, 65, .025) !important;
  box-shadow: none !important;
}
html[data-style="linux"] .lnk:hover {
  transform: none !important;
  border-color: rgba(0, 255, 65, .75) !important;
  background: rgba(0, 255, 65, .08) !important;
  box-shadow: 0 0 18px rgba(0, 255, 65, .16) !important;
}
html[data-style="linux"] .lnk .name,
html[data-style="linux"] .lnk span {
  color: #b6ffce !important;
}
html[data-style="linux"] .lnk .host {
  color: rgba(0, 255, 65, .38) !important;
}
html[data-style="linux"] .ico {
  border-radius: 2px !important;
  background: rgba(0, 255, 65, .1) !important;
  border: 1px solid rgba(0, 255, 65, .25) !important;
}
html[data-style="linux"] .ico-letter {
  color: #00ff41 !important;
  font-family: inherit !important;
}

/* ---------- 标题文字 ---------- */
html[data-style="linux"] h1,
html[data-style="linux"] h2,
html[data-style="linux"] h3 {
  color: #00ff41 !important;
  font-family: inherit !important;
  letter-spacing: .04em;
  text-shadow: 0 0 16px rgba(0, 255, 65, .4);
}
html[data-style="linux"] h1::before {
  content: '> ';
  color: #00e5ff;
}
html[data-style="linux"] .hero-line p,
html[data-style="linux"] #heroSub {
  color: rgba(0, 255, 65, .5) !important;
}
html[data-style="linux"] .hero-line p::before { content: '# '; }

/* ---------- 名言滚动条 ---------- */
html[data-style="linux"] .slogan-bar {
  background: #000 !important;
  border-bottom: 1px solid rgba(0, 255, 65, .3);
}
html[data-style="linux"] .slogan-track {
  color: #00ff41 !important;
  font-family: inherit !important;
  text-shadow: 0 0 10px rgba(0, 255, 65, .6);
}
html[data-style="linux"] .slogan-bar .slogan-link {
  background: #000 !important;
  color: #00e5ff !important;
  border-left: 1px solid rgba(0, 255, 65, .3);
}

/* ---------- 聊天框 / 工具箱 ---------- */
html[data-style="linux"] .chatbox,
html[data-style="linux"] .tb-panel,
html[data-style="linux"] .tb-modal,
html[data-style="linux"] .dl-card,
html[data-style="linux"] .hint-box {
  background: rgba(5, 8, 6, .96) !important;
  border: 1px solid rgba(0, 255, 65, .3) !important;
  border-radius: 4px !important;
  backdrop-filter: none !important;
  box-shadow: 0 0 30px rgba(0, 255, 65, .12) !important;
  color: #b6ffce !important;
}
html[data-style="linux"] .tb-tab,
html[data-style="linux"] .tb-item {
  border-radius: 3px !important;
  border: 1px solid rgba(0, 255, 65, .18) !important;
  background: transparent !important;
  color: rgba(0, 255, 65, .62) !important;
}
html[data-style="linux"] .tb-tab.on,
html[data-style="linux"] .tb-item.on {
  border-color: #00ff41 !important;
  background: rgba(0, 255, 65, .14) !important;
  color: #00ff41 !important;
}

/* ---------- 表格 / 统计 ---------- */
html[data-style="linux"] .stat,
html[data-style="linux"] .chart-card,
html[data-style="linux"] .sa-box,
html[data-style="linux"] .tablewrap,
html[data-style="linux"] .recent-item {
  border-radius: 3px !important;
  border: 1px solid rgba(0, 255, 65, .2) !important;
  background: rgba(0, 255, 65, .03) !important;
  box-shadow: none !important;
  color: #b6ffce !important;
}
html[data-style="linux"] table th {
  color: #00ff41 !important;
  border-color: rgba(0, 255, 65, .3) !important;
}
html[data-style="linux"] table td {
  color: #b6ffce !important;
  border-color: rgba(0, 255, 65, .12) !important;
}

/* ---------- 输入 / 选择 ---------- */
html[data-style="linux"] input,
html[data-style="linux"] textarea,
html[data-style="linux"] select {
  border-radius: 3px !important;
  border: 1px solid rgba(0, 255, 65, .3) !important;
  background: rgba(0, 255, 65, .04) !important;
  color: #b6ffce !important;
  font-family: inherit !important;
  caret-color: #00ff41;
}
html[data-style="linux"] input:focus,
html[data-style="linux"] textarea:focus {
  border-color: #00ff41 !important;
  box-shadow: 0 0 0 2px rgba(0, 255, 65, .16) !important;
}

/* ---------- 涟漪/果冻关掉 ---------- */
html[data-style="linux"] .ripple { display: none !important; }
html[data-style="linux"] .jelly { opacity: 1 !important; transform: none !important; }

/* ---------- 登录门（主站里的）---------- */
html[data-style="linux"] #viewGate .gate {
  border-radius: 4px !important;
  border: 1px solid rgba(0, 255, 65, .4) !important;
  background: rgba(5, 8, 6, .95) !important;
  backdrop-filter: none !important;
  box-shadow: 0 0 40px rgba(0, 255, 65, .16) !important;
  color: #00ff41;
}
html[data-style="linux"] .gate-logo { color: #00ff41 !important; }
html[data-style="linux"] .gate-logo span { color: #00e5ff !important; }
html[data-style="linux"] .gate-sub { color: rgba(0, 255, 65, .55) !important; }
html[data-style="linux"] .gate-cat { display: none !important; }

/* 滚动条 */
html[data-style="linux"] ::-webkit-scrollbar { width: 8px; height: 8px; }
html[data-style="linux"] ::-webkit-scrollbar-track { background: #050505; }
html[data-style="linux"] ::-webkit-scrollbar-thumb {
  background: rgba(0, 255, 65, .3);
  border-radius: 0;
}
html[data-style="linux"] ::-webkit-scrollbar-thumb:hover { background: rgba(0, 255, 65, .6); }


/* ============================================================
   顶部政论滚动条：所有主题强制红色（最高优先级）
   ============================================================ */
.slogan-bar,
html[data-style="linux"] .slogan-bar,
html[data-theme="dark"] .slogan-bar {
  background: #c8102e !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 2px solid #8b0000 !important;
}
.slogan-track,
html[data-style="linux"] .slogan-track,
html[data-theme="dark"] .slogan-track {
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .4) !important;
  font-weight: 700 !important;
}
.slogan-track span::before,
html[data-style="linux"] .slogan-track span::before {
  background: rgba(255, 255, 255, .55) !important;
}
.slogan-bar .slogan-link,
html[data-style="linux"] .slogan-bar .slogan-link,
html[data-theme="dark"] .slogan-bar .slogan-link {
  background: #a00d24 !important;
  color: #ffffff !important;
  border-left: 1px solid rgba(255, 255, 255, .3) !important;
  font-weight: 800 !important;
}
.slogan-bar .slogan-link:hover,
html[data-style="linux"] .slogan-bar .slogan-link:hover {
  background: #d4142f !important;
}

/* ============================================================
   Linux 主题 · 酷炫增强
   ============================================================ */

/* 网格背景 */
html[data-style="linux"] body {
  background-image:
    linear-gradient(rgba(0, 255, 65, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 255, 65, .035) 1px, transparent 1px) !important;
  background-size: 44px 44px !important;
  background-color: #050505 !important;
}

/* 顶部加一条流光线 */
html[data-style="linux"] #viewPortal .topbar::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg,
    transparent, #00ff41 20%, #00e5ff 50%, #00ff41 80%, transparent);
  background-size: 200% 100%;
  animation: ygScanLine 3.5s linear infinite;
  opacity: .9;
}
@keyframes ygScanLine {
  0%   { background-position: -100% 0; }
  100% { background-position: 200% 0; }
}

/* 大标题：打字机光标 */
html[data-style="linux"] h1[data-t-linux]::after {
  content: '';
  display: inline-block;
  width: 9px;
  height: 1em;
  margin-left: 6px;
  vertical-align: -2px;
  background: #00ff41;
  box-shadow: 0 0 12px rgba(0, 255, 65, .9);
  animation: ygBlink 1.05s step-end infinite;
}
@keyframes ygBlink {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0; }
}

/* 大标题辉光更强 */
html[data-style="linux"] h1 {
  font-size: 34px !important;
  letter-spacing: .02em !important;
  text-shadow:
    0 0 8px rgba(0, 255, 65, .9),
    0 0 26px rgba(0, 255, 65, .5),
    0 0 52px rgba(0, 255, 65, .25) !important;
}

/* 分区卡片：左侧竖线 + 悬停打字 */
html[data-style="linux"] .sec-card {
  border-left: 3px solid rgba(0, 255, 65, .55) !important;
}
html[data-style="linux"] .sec-card:hover {
  border-left-color: #00ff41 !important;
}

/* 卡片数量用等宽方括号 */
html[data-style="linux"] .sec-count::before { content: '['; color: #00e5ff; }
html[data-style="linux"] .sec-count::after  { content: ']'; color: #00e5ff; }

/* 图标框：终端风格 */
html[data-style="linux"] .ico {
  background: rgba(0, 255, 65, .08) !important;
  border: 1px solid rgba(0, 255, 65, .3) !important;
  border-radius: 2px !important;
}

/* hover 时链接名前面出箭头 */
html[data-style="linux"] .lnk .name::before {
  content: '';
  transition: none;
}
html[data-style="linux"] .lnk:hover .name::before {
  content: '> ';
  color: #00ff41;
}

/* 按钮：悬停加下划线光标感 */
html[data-style="linux"] .btn {
  position: relative;
}
html[data-style="linux"] .btn::before {
  content: '';
  position: absolute;
  left: 6px; right: 6px; bottom: 3px;
  height: 1px;
  background: rgba(0, 255, 65, .0);
  transition: background .18s;
}
html[data-style="linux"] .btn:hover::before {
  background: rgba(0, 255, 65, .55);
}

/* 搜索框聚焦全边框发光 */
html[data-style="linux"] .searchbox:focus-within {
  border-color: #00ff41 !important;
  box-shadow: 0 0 0 2px rgba(0, 255, 65, .18), 0 0 24px rgba(0, 255, 65, .3) !important;
}

/* 用户名区域 */
html[data-style="linux"] .who-name {
  color: #00ff41 !important;
  text-shadow: 0 0 10px rgba(0, 255, 65, .5);
}
html[data-style="linux"] .who-name::before {
  content: '~$ ';
  color: #00e5ff;
}

/* 分区标题栏 */
html[data-style="linux"] .sec-bar,
html[data-style="linux"] .cats > *::before {
  border-color: rgba(0, 255, 65, .3) !important;
}

/* 滚动条更细更亮 */
html[data-style="linux"] ::-webkit-scrollbar { width: 6px; }
html[data-style="linux"] ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #00ff41, #00e5ff) !important;
}

/* 选中文字反色 */
html[data-style="linux"] ::selection {
  background: #00ff41;
  color: #000;
}

/* 门禁卡片加终端标题栏 */
html[data-style="linux"] #viewGate .gate::before {
  content: '● ● ●';
  position: absolute;
  top: 12px; left: 16px;
  font-size: 9px;
  letter-spacing: 5px;
  color: rgba(0, 255, 65, .35);
}

/* 加载中 / 空状态 */
html[data-style="linux"] .empty {
  color: rgba(0, 255, 65, .45) !important;
  font-family: inherit !important;
}


/* ============================================================
   装逼增强包（只在 html[data-style="linux"] 下生效）
   ============================================================ */

/* ---------- 数字雨背景 ---------- */
#ygRain {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .17;
  mix-blend-mode: screen;
}
html:not([data-style="linux"]) #ygRain { display: none; }

/* ---------- HUD 四角装饰 ---------- */
#ygHud { display: none; }
html[data-style="linux"] #ygHud {
  display: block;
  position: fixed;
  inset: 10px;
  z-index: 9990;
  pointer-events: none;
}
#ygHud i {
  position: absolute;
  width: 26px;
  height: 26px;
  border: 2px solid rgba(0, 255, 65, .55);
  animation: ygHudPulse 2.6s ease-in-out infinite;
}
#ygHud i:nth-child(1) { top: 0; left: 0;  border-right: 0; border-bottom: 0; }
#ygHud i:nth-child(2) { top: 0; right: 0; border-left: 0;  border-bottom: 0; animation-delay: .65s; }
#ygHud i:nth-child(3) { bottom: 0; left: 0;  border-right: 0; border-top: 0; animation-delay: 1.3s; }
#ygHud i:nth-child(4) { bottom: 0; right: 0; border-left: 0;  border-top: 0; animation-delay: 1.95s; }
@keyframes ygHudPulse {
  0%, 100% { opacity: .35; }
  50%      { opacity: 1; box-shadow: 0 0 14px rgba(0, 255, 65, .7); }
}

/* ---------- 右上角假数据流 ---------- */
#ygTicker {
  display: none;
  position: fixed;
  top: 54px;
  right: 18px;
  z-index: 9989;
  width: 176px;
  font: 10px/1.55 ui-monospace, Consolas, monospace;
  color: rgba(0, 255, 65, .5);
  text-align: right;
  pointer-events: none;
  letter-spacing: .02em;
  text-shadow: 0 0 8px rgba(0, 255, 65, .35);
}
html[data-style="linux"] #ygTicker { display: block; }
#ygTicker b { color: #00e5ff; font-weight: 400; }

/* ---------- 开机自检 ---------- */
#ygBoot {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: #020402;
  color: #00ff41;
  font: 12px/1.72 ui-monospace, Consolas, monospace;
  padding: 26px 30px;
  white-space: pre;
  overflow: hidden;
  text-shadow: 0 0 8px rgba(0, 255, 65, .55);
}
html[data-style="linux"] #ygBoot.show { display: block; }
#ygBoot.gone {
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease, visibility .5s;
}
#ygBoot .ok { color: #00e5ff; }
#ygBoot .cursor {
  display: inline-block;
  width: 8px;
  height: 13px;
  background: #00ff41;
  vertical-align: -2px;
  animation: ygBlink 1s step-end infinite;
}

/* ---------- Glitch 标题 ---------- */
html[data-style="linux"] h1[data-t-linux] {
  position: relative;
  display: inline-block;
  color: #00ff41;
}
html[data-style="linux"] h1[data-t-linux]::before,
html[data-style="linux"] h1[data-t-linux]::after {
  content: attr(data-t-linux);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  pointer-events: none;
}
html[data-style="linux"] h1[data-t-linux]::before {
  color: #ff003c;
  animation: ygGlitchA 3.1s infinite steps(1);
  clip-path: inset(0 0 55% 0);
}
html[data-style="linux"] h1[data-t-linux]::after {
  color: #00e5ff;
  animation: ygGlitchB 2.7s infinite steps(1);
  clip-path: inset(58% 0 0 0);
}
@keyframes ygGlitchA {
  0%, 88%, 100% { transform: translate(0, 0); opacity: 0; }
  89% { transform: translate(-2px, -1px); opacity: .85; }
  91% { transform: translate(2px, 1px); opacity: .7; }
  93% { transform: translate(-1px, 1px); opacity: .8; }
  95% { transform: translate(1px, -1px); opacity: .6; }
}
@keyframes ygGlitchB {
  0%, 85%, 100% { transform: translate(0, 0); opacity: 0; }
  86% { transform: translate(2px, 1px); opacity: .8; }
  88% { transform: translate(-2px, -1px); opacity: .65; }
  90% { transform: translate(1px, 1px); opacity: .75; }
  92% { transform: translate(-1px, -1px); opacity: .55; }
}

/* ---------- 鼠标拖尾 ---------- */
#ygTrail { display: none; }
html[data-style="linux"] #ygTrail { display: block; }
#ygTrail i {
  position: fixed;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #00ff41;
  box-shadow: 0 0 8px rgba(0, 255, 65, .9);
  z-index: 9988;
  pointer-events: none;
  will-change: transform, opacity;
}

/* ---------- 卡片 hover 数据流 ---------- */
html[data-style="linux"] .sec-card::after {
  content: '';
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 0;
  background: repeating-linear-gradient(
    180deg,
    rgba(0, 255, 65, .22) 0 2px,
    transparent 2px 6px);
  transition: width .22s ease;
  pointer-events: none;
  border-radius: 0 3px 3px 0;
}
html[data-style="linux"] .sec-card:hover::after { width: 7px; }

/* ---------- 顶栏扫描光柱 ---------- */
html[data-style="linux"] #viewPortal .topbar::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg,
    transparent 40%,
    rgba(0, 255, 65, .12) 48%,
    rgba(0, 229, 255, .18) 52%,
    transparent 60%);
  background-size: 260% 100%;
  animation: ygSweep 4.2s ease-in-out infinite;
  pointer-events: none;
  border-radius: inherit;
}
@keyframes ygSweep {
  0%   { background-position: -120% 0; }
  55%  { background-position: 220% 0; }
  100% { background-position: 220% 0; }
}

/* ---------- 分区卡片编号 ---------- */
html[data-style="linux"] .sec-card { counter-increment: ygcard; }
html[data-style="linux"] .cats { counter-reset: ygcard; }
html[data-style="linux"] .sec-card::before {
  content: '0x' counter(ygcard, decimal);
  position: absolute;
  top: 6px;
  right: 9px;
  font: 9px/1 ui-monospace, Consolas, monospace;
  color: rgba(0, 255, 65, .32);
  pointer-events: none;
  display: block !important;
}

/* ---------- 链接 hover 时的坐标提示 ---------- */
html[data-style="linux"] .lnk {
  position: relative;
}

/* ---------- 全局噪点 ---------- */
html[data-style="linux"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9997;
  pointer-events: none;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: ygNoise .35s steps(4) infinite;
}
@keyframes ygNoise {
  0%   { transform: translate(0, 0); }
  25%  { transform: translate(-3px, 2px); }
  50%  { transform: translate(2px, -3px); }
  75%  { transform: translate(-2px, -2px); }
  100% { transform: translate(3px, 3px); }
}

/* ---------- 侧边竖排状态字 ---------- */
#ygSide {
  display: none;
  position: fixed;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9989;
  writing-mode: vertical-rl;
  font: 9.5px/1 ui-monospace, Consolas, monospace;
  letter-spacing: .42em;
  color: rgba(0, 255, 65, .34);
  pointer-events: none;
  text-shadow: 0 0 10px rgba(0, 255, 65, .3);
}
html[data-style="linux"] #ygSide { display: block; }


/* ============================================================
   计算机嘉豪模式
   ============================================================ */

/* ---------- 黑口罩头像 ---------- */
#ygMask {
  display: none;
  position: fixed;
  right: 22px;
  bottom: 78px;
  z-index: 9989;
  width: 74px;
  height: 74px;
  pointer-events: none;
  opacity: .82;
  filter: drop-shadow(0 0 18px rgba(0, 255, 65, .45));
  animation: ygMaskFloat 4.6s ease-in-out infinite;
}
html[data-style="linux"] #ygMask { display: block; }
@keyframes ygMaskFloat {
  0%, 100% { transform: translateY(0) rotate(-2deg); }
  50%      { transform: translateY(-9px) rotate(2deg); }
}

/* ---------- 右下角假终端 ---------- */
#ygTerm {
  display: none;
  position: fixed;
  right: 18px;
  bottom: 16px;
  z-index: 9989;
  width: 268px;
  max-height: 168px;
  overflow: hidden;
  padding: 9px 11px;
  border-radius: 3px;
  border: 1px solid rgba(0, 255, 65, .34);
  background: rgba(2, 6, 3, .9);
  font: 10px/1.55 ui-monospace, Consolas, monospace;
  color: rgba(0, 255, 65, .78);
  pointer-events: none;
  box-shadow: 0 0 24px rgba(0, 255, 65, .16);
  text-shadow: 0 0 6px rgba(0, 255, 65, .4);
}
html[data-style="linux"] #ygTerm { display: block; }
#ygTerm .bar {
  display: flex;
  gap: 4px;
  margin-bottom: 6px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(0, 255, 65, .18);
}
#ygTerm .bar i {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(0, 255, 65, .55);
}
#ygTerm .bar i:nth-child(2) { background: rgba(0, 229, 255, .55); }
#ygTerm .bar i:nth-child(3) { background: rgba(0, 255, 65, .3); }
#ygTerm .bar span {
  margin-left: auto;
  font-size: 9px;
  color: rgba(0, 255, 65, .35);
  letter-spacing: .08em;
}
#ygTerm .body {
  white-space: pre-wrap;
  word-break: break-all;
}
#ygTerm .cur {
  display: inline-block;
  width: 6px; height: 10px;
  background: #00ff41;
  vertical-align: -1px;
  animation: ygBlink 1s step-end infinite;
}

/* ---------- 分区卡片：hover 加「已渗透」标 ---------- */
html[data-style="linux"] .sec-card {
  position: relative;
}
html[data-style="linux"] .sec-card .yg-pwn {
  position: absolute;
  bottom: 5px;
  right: 8px;
  font: 8.5px/1 ui-monospace, Consolas, monospace;
  color: rgba(0, 255, 65, .0);
  letter-spacing: .12em;
  transition: color .2s;
  pointer-events: none;
}
html[data-style="linux"] .sec-card:hover .yg-pwn {
  color: rgba(0, 255, 65, .78);
}

/* ---------- 顶部小字状态条 ---------- */
#ygStatus {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 9987;
  height: 0;
}
html[data-style="linux"] #ygStatus { display: block; }

/* ---------- 标题更狂的辉光 ---------- */
html[data-style="linux"] h1[data-t-linux] {
  text-shadow:
    0 0 6px rgba(0, 255, 65, 1),
    0 0 20px rgba(0, 255, 65, .8),
    0 0 44px rgba(0, 255, 65, .45),
    0 0 90px rgba(0, 229, 255, .25) !important;
}

/* ---------- 卡片边框呼吸 ---------- */
html[data-style="linux"] .sec-card {
  animation: ygCardBreath 4.2s ease-in-out infinite;
}
@keyframes ygCardBreath {
  0%, 100% { border-color: rgba(0, 255, 65, .26); }
  50%      { border-color: rgba(0, 255, 65, .5); }
}

/* ---------- 搜索框 placeholder 打字感 ---------- */
html[data-style="linux"] #search::placeholder {
  color: rgba(0, 255, 65, .26) !important;
  font-style: italic;
}


/* ============================================================
   嘉豪终极版
   ============================================================ */

/* ---------- 消灭一切粉色/紫色/暖色 ---------- */
html[data-style="linux"] {
  --accent: #00ff41 !important;
  --accent2: #00e5ff !important;
  --accent3: #00ff9d !important;
  --danger: #ff2d2d !important;
  --ok: #00ff41 !important;
  --text: #b6ffce !important;
  --dim: rgba(0, 255, 65, .62) !important;
  --mute: rgba(0, 255, 65, .42) !important;
  --bg: #050505 !important;
  --bg2: #080c09 !important;
  --radius: 3px !important;
}
html[data-style="linux"] * {
  --pink: #00ff41;
}
/* 任何遗留的粉色背景/文字统统改绿 */
html[data-style="linux"] .tag,
html[data-style="linux"] .badge,
html[data-style="linux"] .whoRole,
html[data-style="linux"] #whoRole {
  background: rgba(0, 255, 65, .16) !important;
  color: #00ff41 !important;
  border-color: rgba(0, 255, 65, .4) !important;
}
html[data-style="linux"] .fav-head,
html[data-style="linux"] .recent-head {
  color: #00e5ff !important;
  border-color: rgba(0, 255, 65, .28) !important;
}
html[data-style="linux"] .fav-clear {
  color: rgba(0, 255, 65, .6) !important;
  border-color: rgba(0, 255, 65, .3) !important;
}
/* 分区详情页标题 */
html[data-style="linux"] .detail-head h2 {
  color: #00ff41 !important;
  text-shadow: 0 0 16px rgba(0, 255, 65, .5) !important;
}
html[data-style="linux"] .detail-count {
  color: rgba(0, 255, 65, .5) !important;
}
/* 下载卡片 / 提示框 */
html[data-style="linux"] .download,
html[data-style="linux"] .dl-card {
  background: rgba(0, 255, 65, .04) !important;
  border-color: rgba(0, 255, 65, .3) !important;
  color: #b6ffce !important;
}
/* toast */
html[data-style="linux"] .toast {
  background: rgba(3, 8, 5, .96) !important;
  border: 1px solid #00ff41 !important;
  color: #00ff41 !important;
  border-radius: 2px !important;
  box-shadow: 0 0 26px rgba(0, 255, 65, .35) !important;
}
/* 滚动条 */
html[data-style="linux"] ::-webkit-scrollbar-thumb {
  background: #00ff41 !important;
}

/* ---------- 嘉豪敲电脑场景（右下角） ---------- */
#ygGuy {
  display: none;
  position: fixed;
  right: 12px;
  bottom: 0;
  z-index: 9986;
  width: 260px;
  height: 210px;
  pointer-events: none;
  opacity: .95;
}
html[data-style="linux"] #ygGuy { display: block; }

#ygGuy svg { width: 100%; height: 100%; display: block; }

/* 手臂敲击 */
#ygGuy .arm-l { transform-origin: 118px 132px; animation: ygTypeL .42s steps(2) infinite; }
#ygGuy .arm-r { transform-origin: 158px 132px; animation: ygTypeR .36s steps(2) infinite; }
@keyframes ygTypeL {
  0%   { transform: rotate(-4deg) translateY(0); }
  50%  { transform: rotate(2deg) translateY(-2px); }
  100% { transform: rotate(-4deg) translateY(0); }
}
@keyframes ygTypeR {
  0%   { transform: rotate(3deg) translateY(-1px); }
  50%  { transform: rotate(-3deg) translateY(1px); }
  100% { transform: rotate(3deg) translateY(-1px); }
}
/* 头部微晃 */
#ygGuy .head { transform-origin: 138px 96px; animation: ygHeadBob 3.6s ease-in-out infinite; }
@keyframes ygHeadBob {
  0%, 100% { transform: rotate(-1.6deg); }
  50%      { transform: rotate(1.6deg); }
}
/* 屏幕辉光呼吸 */
#ygGuy .glow { animation: ygScrGlow 2.8s ease-in-out infinite; }
@keyframes ygScrGlow {
  0%, 100% { opacity: .35; }
  50%      { opacity: .8; }
}
/* 屏幕里的代码行滚动 */
#ygGuy .code-lines { animation: ygCodeScroll 6s linear infinite; }
@keyframes ygCodeScroll {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-40px); }
}

/* ---------- 数码雨转场遮罩 ---------- */
#ygWipe {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99995;
  background: #000;
  pointer-events: none;
  opacity: 0;
}
html[data-style="linux"] #ygWipe { display: block; }
#ygWipe.on {
  opacity: 1;
  pointer-events: all;
}
#ygWipe canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
#ygWipe .wipe-txt {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font: 15px/1.6 ui-monospace, Consolas, monospace;
  color: #00ff41;
  letter-spacing: .28em;
  text-shadow: 0 0 18px rgba(0, 255, 65, .9);
  opacity: 0;
}
#ygWipe .wipe-txt.show { opacity: 1; }

/* ---------- 进站全屏代码雨 ---------- */
#ygSplash {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99996;
  background: #000;
}
html[data-style="linux"] #ygSplash.show { display: block; }
#ygSplash canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
#ygSplash.gone {
  opacity: 0;
  visibility: hidden;
  transition: opacity .65s ease, visibility .65s;
}


/* 远控增强面板 */
.yc-sec {
  margin: 0 0 18px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(0, 0, 0, .07);
  background: rgba(255, 255, 255, .6);
}
.yc-sec h4 {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .04em;
  color: #2d3748;
}
html[data-theme="dark"] .yc-sec {
  border-color: rgba(255, 255, 255, .08);
  background: rgba(255, 255, 255, .03);
}
html[data-theme="dark"] .yc-sec h4 { color: #cfd8e6; }

.yc-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.yc-row.yc-wrap { flex-wrap: wrap; }
.yc-info { font-size: 11.5px; color: #8a94a6; margin-left: auto; }

.yc-btn {
  padding: 7px 14px;
  border-radius: 9px;
  border: 1px solid rgba(0, 0, 0, .1);
  background: #fff;
  color: #364152;
  font: inherit;
  font-size: 12.5px;
  font-weight: 650;
  cursor: pointer;
  transition: all .16s ease;
  white-space: nowrap;
}
.yc-btn:hover { border-color: #4a6cf7; color: #4a6cf7; background: #f3f6ff; }
.yc-btn:active { transform: scale(.97); }
.yc-btn.danger { border-color: rgba(224, 62, 62, .35); color: #d64545; }
.yc-btn.danger:hover { background: #fff2f2; border-color: #d64545; }
html[data-theme="dark"] .yc-btn {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .12);
  color: #cfd8e6;
}
html[data-theme="dark"] .yc-btn:hover { background: rgba(74, 108, 247, .16); }

.yc-mini {
  padding: 3px 9px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, .1);
  background: #fff;
  color: #4a5568;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}
.yc-mini:hover { border-color: #4a6cf7; color: #4a6cf7; }
.yc-mini.danger { color: #d64545; border-color: rgba(224, 62, 62, .3); }
html[data-theme="dark"] .yc-mini {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .12);
  color: #b8c2d2;
}

.yc-in {
  flex: 1;
  min-width: 120px;
  padding: 7px 11px;
  border-radius: 9px;
  border: 1px solid rgba(0, 0, 0, .1);
  background: #fff;
  font: inherit;
  font-size: 12.5px;
  color: #2d3748;
}
.yc-in:focus { outline: 0; border-color: #4a6cf7; box-shadow: 0 0 0 3px rgba(74, 108, 247, .12); }
html[data-theme="dark"] .yc-in {
  background: rgba(255, 255, 255, .05);
  border-color: rgba(255, 255, 255, .12);
  color: #e2e8f0;
}

.yc-ta {
  width: 100%;
  padding: 9px 12px;
  border-radius: 9px;
  border: 1px solid rgba(0, 0, 0, .1);
  background: #fff;
  font: 12px/1.6 ui-monospace, Consolas, monospace;
  color: #2d3748;
  resize: vertical;
  margin-bottom: 8px;
}
.yc-ta:focus { outline: 0; border-color: #4a6cf7; box-shadow: 0 0 0 3px rgba(74, 108, 247, .12); }
html[data-theme="dark"] .yc-ta {
  background: rgba(255, 255, 255, .04);
  border-color: rgba(255, 255, 255, .12);
  color: #e2e8f0;
}

.rc-t { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Linux 主题下也套绿 */
html[data-style="linux"] .yc-sec {
  border: 1px solid rgba(0, 255, 65, .25);
  background: rgba(0, 255, 65, .03);
  border-radius: 3px;
}
html[data-style="linux"] .yc-sec h4 { color: #00ff41; text-shadow: 0 0 10px rgba(0,255,65,.4); }
html[data-style="linux"] .yc-btn {
  border: 1px solid rgba(0, 255, 65, .4);
  background: rgba(0, 255, 65, .06);
  color: #00ff41;
  border-radius: 3px;
}
html[data-style="linux"] .yc-btn:hover { background: rgba(0, 255, 65, .16); border-color: #00ff41; }
html[data-style="linux"] .yc-mini {
  border: 1px solid rgba(0, 255, 65, .3);
  background: transparent;
  color: rgba(0, 255, 65, .8);
  border-radius: 2px;
}
html[data-style="linux"] .yc-in,
html[data-style="linux"] .yc-ta {
  border: 1px solid rgba(0, 255, 65, .3);
  background: rgba(0, 255, 65, .04);
  color: #b6ffce;
  border-radius: 3px;
  font-family: ui-monospace, Consolas, monospace;
}

/* 风格切换按钮 */
#styleBtn.off {
  border-color: rgba(0, 255, 65, .5) !important;
  color: #00ff41 !important;
  background: rgba(0, 255, 65, .08) !important;
  font-family: ui-monospace, Consolas, monospace;
  text-shadow: 0 0 8px rgba(0, 255, 65, .5);
}
#styleBtn .st-label {
  font-weight: 800;
  letter-spacing: .02em;
}
html[data-style="linux"] #styleBtn {
  border-color: rgba(0, 255, 65, .55) !important;
  color: #00ff41 !important;
  background: rgba(0, 255, 65, .1) !important;
  border-radius: 3px !important;
}

/* ============================================================
   进站 loading（轻量，不阻塞）
   ============================================================ */
#ygSplashMini {
  position: fixed;
  inset: 0;
  z-index: 99990;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 16px;
  background: #fffafc;
  transition: opacity .35s ease, visibility .35s;
}
html[data-theme="dark"] #ygSplashMini { background: #0a0910; }
html[data-style="linux"] #ygSplashMini {
  background: #050505;
}

#ygSplashMini.gone {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.ysm-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ff7eb6;
  box-shadow: 0 0 0 0 rgba(255, 126, 182, .6);
  animation: ysmPulse 1.2s ease-out infinite;
}
html[data-theme="dark"] .ysm-dot { background: #b47cff; }
html[data-style="linux"] .ysm-dot {
  background: #00ff41;
  box-shadow: 0 0 0 0 rgba(0, 255, 65, .7);
  border-radius: 1px;
}
@keyframes ysmPulse {
  0%   { box-shadow: 0 0 0 0 rgba(255, 126, 182, .6); }
  70%  { box-shadow: 0 0 0 12px rgba(255, 126, 182, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 126, 182, 0); }
}
html[data-style="linux"] @keyframes ysmPulse {
  0%   { box-shadow: 0 0 0 0 rgba(0, 255, 65, .7); }
  70%  { box-shadow: 0 0 0 12px rgba(0, 255, 65, 0); }
  100% { box-shadow: 0 0 0 0 rgba(0, 255, 65, 0); }
}

.ysm-txt {
  font-size: 11.5px;
  letter-spacing: .3em;
  color: #c4a8b6;
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
}
html[data-theme="dark"] .ysm-txt { color: #5a5a68; }
html[data-style="linux"] .ysm-txt {
  color: rgba(0, 255, 65, .55);
  text-shadow: 0 0 10px rgba(0, 255, 65, .4);
}

/* 纯 CSS 兜底：5 秒后自动消失（即使 JS 全挂） */
@keyframes ysmAutoHide {
  to { opacity: 0; visibility: hidden; pointer-events: none; }
}
#ygSplashMini { animation: ysmAutoHide .4s 5s forwards; }

/* ============================================================
   底部登录按钮
   ============================================================ */
.foot-login {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border: 1px solid rgba(0, 0, 0, .1);
  border-radius: 999px;
  background: rgba(255, 255, 255, .6);
  color: #8a94a6;
  font: inherit;
  font-size: 11.5px;
  cursor: pointer;
  transition: all .18s;
  vertical-align: middle;
}
.foot-login .i { width: 11px; height: 11px; }
.foot-login:hover {
  color: #4a6cf7;
  border-color: rgba(74, 108, 247, .35);
  background: rgba(74, 108, 247, .07);
}
.foot-login:disabled { opacity: .5; cursor: wait; }

.foot-login.on {
  color: #16a34a;
  border-color: rgba(22, 163, 74, .35);
  background: rgba(22, 163, 74, .08);
}
.foot-login.on:hover {
  color: #dc2626;
  border-color: rgba(220, 38, 38, .35);
  background: rgba(220, 38, 38, .07);
}

/* 深色 */
html[data-theme="dark"] .foot-login {
  border-color: rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .05);
  color: #6b7788;
}
html[data-theme="dark"] .foot-login:hover {
  color: #8aa4ff;
  border-color: rgba(138, 164, 255, .4);
  background: rgba(138, 164, 255, .1);
}
html[data-theme="dark"] .foot-login.on {
  color: #4ade80;
  border-color: rgba(74, 222, 128, .4);
  background: rgba(74, 222, 128, .1);
}

/* Linux */
html[data-style="linux"] .foot-login {
  border: 1px solid rgba(0, 255, 65, .3);
  background: rgba(0, 255, 65, .05);
  color: rgba(0, 255, 65, .6);
  border-radius: 2px;
  font-family: ui-monospace, Consolas, monospace;
}
html[data-style="linux"] .foot-login:hover {
  color: #00ff41;
  border-color: #00ff41;
  background: rgba(0, 255, 65, .12);
  text-shadow: 0 0 8px rgba(0, 255, 65, .6);
}
html[data-style="linux"] .foot-login.on {
  color: #00ff41;
  border-color: #00ff41;
  background: rgba(0, 255, 65, .18);
  box-shadow: 0 0 12px rgba(0, 255, 65, .3);
}

/* ============================================================
   登录弹窗
   ============================================================ */
.lgm {
  position: fixed;
  inset: 0;
  z-index: 99995;
  display: grid;
  place-items: center;
}
.lgm.hidden { display: none; }

.lgm-mask {
  position: absolute;
  inset: 0;
  background: rgba(12, 10, 18, .48);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: lgmFade .2s ease;
}
@keyframes lgmFade { from { opacity: 0; } to { opacity: 1; } }

.lgm-box {
  position: relative;
  width: min(360px, calc(100vw - 40px));
  padding: 26px 26px 22px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .08);
  box-shadow: 0 24px 64px -12px rgba(30, 20, 50, .32);
  animation: lgmPop .24s cubic-bezier(.2, .9, .3, 1.2);
}
@keyframes lgmPop {
  from { opacity: 0; transform: translateY(14px) scale(.96); }
  to   { opacity: 1; transform: none; }
}

.lgm-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 850;
  color: #2d3748;
  margin-bottom: 6px;
}
.lgm-head .i { width: 16px; height: 16px; color: #4a6cf7; }

.lgm-sub {
  margin: 0 0 16px;
  font-size: 12px;
  color: #94a3b8;
}

.lgm-pwd {
  width: 100%;
  padding: 11px 14px;
  border-radius: 11px;
  border: 1px solid rgba(0, 0, 0, .1);
  background: #fafbfd;
  font: inherit;
  font-size: 14px;
  letter-spacing: .12em;
  color: #2d3748;
  box-sizing: border-box;
}
.lgm-pwd:focus {
  outline: 0;
  border-color: #4a6cf7;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(74, 108, 247, .12);
}

.lgm-err {
  min-height: 16px;
  margin-top: 8px;
  font-size: 12px;
  color: #dc2626;
}

.lgm-actions {
  display: flex;
  gap: 9px;
  margin-top: 6px;
}
.lgm-actions .btn { flex: 1; justify-content: center; }

body.lgm-open { overflow: hidden; }

/* 深色 */
html[data-theme="dark"] .lgm-mask { background: rgba(0, 0, 0, .62); }
html[data-theme="dark"] .lgm-box {
  background: #14131c;
  border-color: rgba(255, 255, 255, .1);
  box-shadow: 0 24px 64px -12px rgba(0, 0, 0, .7);
}
html[data-theme="dark"] .lgm-head { color: #e2e8f0; }
html[data-theme="dark"] .lgm-head .i { color: #8aa4ff; }
html[data-theme="dark"] .lgm-sub { color: #64748b; }
html[data-theme="dark"] .lgm-pwd {
  background: rgba(255, 255, 255, .05);
  border-color: rgba(255, 255, 255, .12);
  color: #e2e8f0;
}
html[data-theme="dark"] .lgm-pwd:focus { background: rgba(255,255,255,.08); }

/* Linux */
html[data-style="linux"] .lgm-mask {
  background: rgba(0, 0, 0, .78);
  backdrop-filter: none;
}
html[data-style="linux"] .lgm-box {
  background: #0a0a0a;
  border: 1px solid #00ff41;
  border-radius: 3px;
  box-shadow: 0 0 32px rgba(0, 255, 65, .25), inset 0 0 40px rgba(0, 255, 65, .03);
}
html[data-style="linux"] .lgm-head {
  color: #00ff41;
  font-family: ui-monospace, Consolas, monospace;
  letter-spacing: .04em;
  text-shadow: 0 0 10px rgba(0, 255, 65, .5);
}
html[data-style="linux"] .lgm-head::before {
  content: '> ';
  opacity: .7;
}
html[data-style="linux"] .lgm-head::after {
  content: '_';
  animation: lgmBlink 1s steps(1) infinite;
}
@keyframes lgmBlink { 50% { opacity: 0; } }
html[data-style="linux"] .lgm-sub {
  color: rgba(0, 255, 65, .4);
  font-family: ui-monospace, Consolas, monospace;
}
html[data-style="linux"] .lgm-pwd {
  background: #000;
  border: 1px solid rgba(0, 255, 65, .45);
  border-radius: 2px;
  color: #00ff41;
  font-family: ui-monospace, Consolas, monospace;
  letter-spacing: .3em;
}
html[data-style="linux"] .lgm-pwd:focus {
  border-color: #00ff41;
  box-shadow: 0 0 0 2px rgba(0, 255, 65, .2);
}
html[data-style="linux"] .lgm-err { color: #ff5555; font-family: ui-monospace, monospace; }

/* ============================================================
   分区分组：tab 栏 + 组头 + 折叠
   ============================================================ */

/* ---------- 组切换 tab ---------- */
.group-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0 0 18px;
  padding-bottom: 2px;
}

.gtab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, .08);
  background: rgba(255, 255, 255, .72);
  color: #6b7788;
  font: inherit;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
  transition: all .16s ease;
  white-space: nowrap;
}
.gtab:hover {
  color: #4a6cf7;
  border-color: rgba(74, 108, 247, .3);
  background: rgba(74, 108, 247, .06);
  transform: translateY(-1px);
}
.gtab.on {
  color: #fff;
  background: linear-gradient(135deg, #6676ff, #4a6cf7);
  border-color: transparent;
  box-shadow: 0 4px 14px -4px rgba(74, 108, 247, .55);
}
.gtn {
  font-size: 10.5px;
  font-weight: 800;
  padding: 1px 5px;
  border-radius: 999px;
  background: rgba(0, 0, 0, .06);
  color: inherit;
  opacity: .75;
}
.gtab.on .gtn {
  background: rgba(255, 255, 255, .25);
  opacity: 1;
}

/* ---------- 组头 ---------- */
.gsec {
  margin-bottom: 22px;
  width: 100%;
}

.gsec-h {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 8px 4px 10px;
  border: 0;
  background: transparent;
  color: #2d3748;
  font: inherit;
  cursor: pointer;
  text-align: left;
  border-bottom: 1px dashed rgba(0, 0, 0, .08);
  margin-bottom: 14px;
  transition: color .16s;
}
.gsec-h:hover { color: #4a6cf7; }

.gsec-arrow {
  display: inline-block;
  font-size: 12px;
  color: #b0b8c4;
  transition: transform .2s ease;
  transform: rotate(0deg);
}
.gsec-arrow.col { transform: rotate(-90deg); }

.gsec-name {
  font-size: 15px;
  font-weight: 850;
  letter-spacing: .01em;
}
.gsec-n {
  margin-left: auto;
  font-size: 11px;
  color: #b0b8c4;
  font-weight: 600;
}

.gsec-body {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
  gap: 13px;
  /* 不用 max-height 动画：那会每帧重排整页，比不加动画还卡 */
}
.gsec-body.col {
  display: none;
}
/* 展开时轻量淡入（只动 opacity/transform，GPU 可合成，不触发重排） */
.gsec-body:not(.col) {
  animation: gsecIn .18s cubic-bezier(.2,.8,.3,1);
}
@keyframes gsecIn {
  from { opacity: 0; transform: translate3d(0, -5px, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* 组内的 .cats 不要重复网格 */
.gsec-body .sec-card { margin: 0; }

/* ---------- 深色 ---------- */
html[data-theme="dark"] .gtab {
  border-color: rgba(255, 255, 255, .1);
  background: rgba(255, 255, 255, .04);
  color: #8892a4;
}
html[data-theme="dark"] .gtab:hover {
  color: #8aa4ff;
  border-color: rgba(138, 164, 255, .35);
  background: rgba(138, 164, 255, .1);
}
html[data-theme="dark"] .gtab.on {
  color: #0a0910;
  background: linear-gradient(135deg, #9bb0ff, #7c8cff);
  box-shadow: 0 4px 16px -4px rgba(124, 140, 255, .6);
}
html[data-theme="dark"] .gtn { background: rgba(255, 255, 255, .1); }
html[data-theme="dark"] .gsec-h {
  color: #d8dfea;
  border-bottom-color: rgba(255, 255, 255, .08);
}
html[data-theme="dark"] .gsec-h:hover { color: #8aa4ff; }
html[data-theme="dark"] .gsec-arrow { color: #4a5568; }
html[data-theme="dark"] .gsec-n { color: #4a5568; }

/* ---------- Linux ---------- */
html[data-style="linux"] .group-bar { gap: 5px; }
html[data-style="linux"] .gtab {
  border: 1px solid rgba(0, 255, 65, .25);
  background: rgba(0, 255, 65, .04);
  color: rgba(0, 255, 65, .6);
  border-radius: 2px;
  font-family: ui-monospace, Consolas, monospace;
  font-size: 12px;
  letter-spacing: .02em;
}
html[data-style="linux"] .gtab::before { content: '['; opacity: .5; }
html[data-style="linux"] .gtab::after  { content: ']'; opacity: .5; }
html[data-style="linux"] .gtab:hover {
  color: #00ff41;
  border-color: rgba(0, 255, 65, .7);
  background: rgba(0, 255, 65, .12);
  transform: none;
  text-shadow: 0 0 8px rgba(0, 255, 65, .6);
}
html[data-style="linux"] .gtab.on {
  color: #000;
  background: #00ff41;
  border-color: #00ff41;
  box-shadow: 0 0 16px rgba(0, 255, 65, .55);
  text-shadow: none;
}
html[data-style="linux"] .gtab.on .gtn {
  background: rgba(0, 0, 0, .2);
  color: #000;
}
html[data-style="linux"] .gtn {
  background: rgba(0, 255, 65, .12);
  color: inherit;
  border-radius: 2px;
  font-family: ui-monospace, monospace;
}

html[data-style="linux"] .gsec-h {
  color: #00ff41;
  border-bottom: 1px dashed rgba(0, 255, 65, .22);
  font-family: ui-monospace, Consolas, monospace;
}
html[data-style="linux"] .gsec-h::before {
  content: '$ ';
  color: rgba(0, 255, 65, .55);
}
html[data-style="linux"] .gsec-h:hover { color: #7dffa5; }
html[data-style="linux"] .gsec-name {
  text-shadow: 0 0 10px rgba(0, 255, 65, .35);
}
html[data-style="linux"] .gsec-n {
  color: rgba(0, 255, 65, .38);
  font-family: ui-monospace, monospace;
}
html[data-style="linux"] .gsec-arrow { color: rgba(0, 255, 65, .5); }

/* 手机 */
@media (max-width: 560px) {
  .group-bar { gap: 5px; }
  .gtab { padding: 6px 11px; font-size: 12px; }
  .gsec-body {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
  }
  .gsec-name { font-size: 14px; }
  .gsec-n { font-size: 10px; }
}

/* 折叠提示 */
.gsec-hint {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 7px;
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #b0b8c4;
  background: rgba(0, 0, 0, .05);
  vertical-align: 1px;
}
.gsec-h:hover .gsec-hint {
  color: #4a6cf7;
  background: rgba(74, 108, 247, .1);
}

html[data-theme="dark"] .gsec-hint {
  color: #5a6678;
  background: rgba(255, 255, 255, .06);
}
html[data-theme="dark"] .gsec-h:hover .gsec-hint {
  color: #8aa4ff;
  background: rgba(138, 164, 255, .14);
}

html[data-style="linux"] .gsec-hint {
  color: rgba(0, 255, 65, .5);
  background: rgba(0, 255, 65, .08);
  border-radius: 2px;
  font-family: ui-monospace, Consolas, monospace;
}
html[data-style="linux"] .gsec-h:hover .gsec-hint {
  color: #00ff41;
  background: rgba(0, 255, 65, .18);
}

/* 全折叠状态：组头之间稍微拉开，看着不像空页 */
.gsec-body.col + .gsec,
.gsec:has(.gsec-body.col) { margin-bottom: 12px; }
.gsec-body.col { margin-bottom: -8px; }

/* ============================================================
   性能优化层（视觉基本不变，GPU 开销大幅下降）
   ============================================================ */

/* 1) 整页背景模糊：视觉上几乎看不出，但每帧都要重算整个视口 —— 直接干掉 */
html body,
body::before,
body::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* 2) 分区卡片：111 张同时模糊是最大的 GPU 杀手
      改成「稍实的背景」，单张肉眼无差，整体流畅度差很多 */
.sec-card,
.sec-card.jelly,
.cats .sec-card {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(255, 255, 255, .94) !important;
}
html[data-theme="dark"] .sec-card,
html[data-theme="dark"] .sec-card.jelly {
  background: rgba(22, 24, 34, .94) !important;
}
html[data-style="linux"] .sec-card {
  background: rgba(4, 10, 6, .96) !important;
}

/* 3) 链接卡片同样处理 */
.lnk,
.detail-grid .lnk {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* 4) 顶栏保留模糊（视觉核心），但加隔离，避免影响下面元素重绘 */
#viewPortal .topbar {
  contain: layout style;
  will-change: transform;
}

/* 5) 只给「少量、常驻动画」的元素升合成层
      卡片有 111 张 —— 全加 translateZ(0) 会创建 111 个合成层，吃爆显存 */
.gtab,
.gsec-h {
  will-change: transform;
  backface-visibility: hidden;
}
/* 卡片只在 hover 时临时升层，松手就释放 */
.sec-card:hover,
.btn:hover {
  will-change: transform;
}
.sec-card:not(:hover),
.btn:not(:hover) {
  will-change: auto;
}

/* 6) 组区块隔离布局（只隔离 .gsec 本身，body 上不加） */
.gsec {
  contain: layout style;
}

/* 7) 果冻入场动画：只跑一次，跑完释放 will-change */
.sec-card.jelly.done {
  will-change: auto;
}

/* 8) 搜索框、提示条不做模糊 */
.searchbox,
.hint-box {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(255, 255, 255, .96) !important;
}
html[data-theme="dark"] .searchbox,
html[data-theme="dark"] .hint-box {
  background: rgba(22, 24, 34, .96) !important;
}

/* ============================================================
   系统级：跟随系统「减少动态效果」
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .sec-card,
  .gtab,
  .gsec-h { will-change: auto !important; }
}

/* ============================================================
   低端设备自动降级（内存 <= 4GB 或核心 <= 4 时生效）
   ============================================================ */
body.low-end #ygRain,
body.low-end #ygTrail,
body.low-end #ygSide {
  display: none !important;
}
body.low-end .gtab,
body.low-end .gsec-h {
  will-change: auto !important;
}
body.low-end .sec-card.jelly {
  animation: none !important;
  opacity: 1 !important;
}
body.low-end .slogan-bar,
body.low-end .gsec-h {
  contain: none;
}