:root{
  --bg:#070a12;--fg:#e9eef7;--muted:rgba(233,238,247,.65);
  --glass:rgba(255,255,255,.08);--glass2:rgba(255,255,255,.12);
  --bd:rgba(255,255,255,.16);--shadow:0 18px 60px rgba(0,0,0,.45);
  --r:18px;
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;color:var(--fg);background:var(--bg);
  font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"PingFang SC","Microsoft YaHei"}
.bg{position:fixed;inset:0;
  background:
    radial-gradient(1200px 700px at 20% 20%, rgba(125,211,252,.25), transparent 55%),
    radial-gradient(900px 700px at 80% 15%, rgba(167,139,250,.22), transparent 50%),
    radial-gradient(900px 700px at 60% 85%, rgba(34,211,238,.16), transparent 55%),
    url("assets/bg.jpg") center/cover no-repeat;
  filter:saturate(1.05);transform:scale(1.03)
}
.shade{position:fixed;inset:0;background:linear-gradient(to bottom, rgba(0,0,0,.45), rgba(0,0,0,.55))}
.wrap{position:relative;max-width:1100px;margin:0 auto;padding:24px}
.top{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:18px}
.brand{display:flex;align-items:center;gap:10px;user-select:none}
.brand .dot{width:10px;height:10px;border-radius:99px;background:#60a5fa;box-shadow:0 0 18px rgba(96,165,250,.65)}
.brand .title{font-weight:700;letter-spacing:.4px;opacity:.95}
.tabs{display:flex;gap:14px;flex-wrap:wrap;padding:10px 12px;border-radius:999px;
  background:var(--glass);border:1px solid var(--bd);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:var(--shadow)}
.tab{padding:8px 12px;border-radius:999px;color:var(--muted);text-decoration:none;cursor:pointer;border:1px solid transparent}
.tab.active{color:var(--fg);background:var(--glass2);border-color:rgba(255,255,255,.22)}
.searchBox{margin-top:26px}
.engineRow{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:10px}
.engine{padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);color:var(--muted);cursor:pointer;user-select:none}
.engine.active{color:var(--fg);background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.24)}
.searchBar{display:flex;gap:10px;background:var(--glass);border:1px solid var(--bd);border-radius:999px;
  padding:10px 12px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--shadow)}
.searchBar input{flex:1;background:transparent;border:0;outline:none;color:var(--fg);font-size:16px;padding:6px 8px}
.searchBar button{border:0;background:rgba(255,255,255,.12);color:var(--fg);border-radius:999px;padding:10px 14px;cursor:pointer}
.searchBar button:hover{background:rgba(255,255,255,.18)}
.grid{margin-top:22px;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.card{display:flex;align-items:center;gap:12px;padding:14px 14px;border-radius:var(--r);
  background:var(--glass);border:1px solid var(--bd);text-decoration:none;color:var(--fg);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow);
  transition:transform .12s ease, background .12s ease}
.card:hover{transform:translateY(-2px);background:rgba(255,255,255,.12)}
.icon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);overflow:hidden}
.icon img{width:22px;height:22px;display:block}
.meta{min-width:0}
.name{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.desc{font-size:12px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hide{display:none!important}
.foot{margin:22px 0 10px;text-align:center;color:var(--muted);font-size:12px}