:root { color-scheme: light; --bg:#f6f8fc; --paper:#fff; --ink:#202938; --muted:#7d8796; --blue:#386be8; --line:#e7ebf2; --font:"Segoe UI","Microsoft YaHei UI","PingFang SC",system-ui,sans-serif; --ease:cubic-bezier(.2,.8,.2,1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:150px; }
body { margin:0; color:var(--ink); background:var(--bg); font:14px/1.6 var(--font); -webkit-font-smoothing:antialiased; }
button,input { font:inherit; }
a { color:inherit; text-decoration:none; }
button { color:inherit; cursor:pointer; }
a,button { touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
[hidden] { display:none!important; }
::selection { background:#dfeaff; }
.icon-library { position:absolute; width:0; height:0; overflow:hidden; }
.icon { flex:0 0 auto; width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.icon.small { width:15px; height:15px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
:focus-visible { outline:2px solid #6c9aff; outline-offset:4px; }
.skip-link { position:fixed; top:-100px; left:20px; z-index:100; padding:12px 20px; border-radius:8px; color:white; background:var(--blue); }
.skip-link:focus { top:12px; }
.site-header { position:sticky; top:0; z-index:40; background:#ffffffed; border-bottom:1px solid var(--line); backdrop-filter:blur(16px); }
.header-inner { display:flex; align-items:center; height:73px; max-width:1360px; padding:0 40px; margin:auto; }
.brand { display:flex; align-items:center; gap:10px; }
.brand-symbol { display:grid; place-items:center; width:35px; height:36px; border-radius:10px; background:var(--blue); color:white; box-shadow:0 3px 8px #386be81a; }
.brand-symbol .icon { width:21px; height:21px; stroke-width:1.7; }
.brand-name { font-size:23px; font-weight:700; letter-spacing:.5px; }
.header-divider { width:1px; height:18px; margin-left:23px; background:var(--line); }
.header-nav { display:flex; align-items:center; gap:27px; margin-left:24px; font-size:12px; color:#8490a1; }
.header-nav a:hover { color:var(--blue); }
.header-nav .current { color:#354765; font-weight:600; }
.motion-toggle { display:flex; align-items:center; gap:7px; min-height:40px; margin-left:auto; padding:0 11px; border:1px solid var(--line); border-radius:8px; color:#8593a7; background:white; font-size:11px; transition:border-color .2s,color .2s; }
.motion-toggle .icon { width:16px; height:16px; }
.motion-toggle[aria-pressed="true"] .icon { color:#5b80dc; }
.motion-toggle:hover { border-color:#c9dafa; color:var(--blue); }
.workspace { max-width:1360px; margin:auto; padding:35px 40px 0; }
main:focus { outline:0; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-bottom:24px; }
h1 { margin:0; font-size:30px; font-weight:700; line-height:1.35; letter-spacing:-.7px; }
.page-description { margin:9px 0 0; color:#8691a1; font-size:12px; }
.collection-count { display:flex; align-items:center; gap:8px; padding:7px 11px; border:1px solid #e4eaf4; border-radius:7px; color:#8190a6; background:#fcfdff; font-size:10px; white-space:nowrap; }
.collection-count strong { color:#49658f; font-size:14px; font-weight:600; }
.search-box { display:flex; align-items:center; gap:13px; width:100%; height:58px; padding:0 19px; border:1px solid #e2e8f1; border-radius:12px; background:white; box-shadow:0 2px 5px #253e6303; transition:border-color .2s,box-shadow .2s; }
.search-box:focus-within { border-color:#8dadf2; box-shadow:0 0 0 3px #e8f0ff; }
.search-icon { width:21px; height:21px; color:#8b9bb3; }
.search-box input { flex:1; min-width:0; width:100%; height:100%; padding:0; outline:0; border:0; color:var(--ink); background:transparent; font-size:13px; }
.search-box input::placeholder { color:#a2acbc; }
input[type="search"]::-webkit-search-cancel-button { display:none; }
.search-shortcut { display:grid; place-items:center; width:24px; height:25px; border:1px solid #e9edf4; border-radius:5px; color:#a8b2c2; font:11px var(--font); }
.clear-search { display:grid; place-items:center; width:30px; height:30px; padding:0; border:0; border-radius:6px; color:#93a1b6; background:#f1f5fb; }
.category-bar { position:sticky; top:72px; z-index:25; margin:10px -7px 9px; padding:10px 7px; background:#f6f8fcf5; backdrop-filter:blur(15px); }
.category-nav { position:relative; isolation:isolate; display:flex; gap:5px; min-height:42px; overflow-x:auto; scrollbar-width:none; }
.category-nav::-webkit-scrollbar { display:none; }
.category-indicator { position:absolute; z-index:-1; top:0; left:0; height:42px; border:1px solid #dce7ff; border-radius:9px; background:#eaf1ff; pointer-events:none; }
.category-button { display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; gap:7px; min-height:42px; padding:0 15px; border:0; border-radius:9px; color:#8793a5; background:transparent; font-size:11px; white-space:nowrap; transition:color .2s; }
.category-button .icon { width:15px; height:15px; }
.category-button[aria-pressed="true"] { color:#3a69cc; font-weight:600; }
.category-button:hover { color:#3d6ed0; }
.category-count { margin-left:2px; padding:0 4px; color:#a0aec2; font-size:9px; font-weight:400; }
.category-button[aria-pressed="true"] .category-count { color:#7898d8; }
.notice { display:flex; align-items:center; gap:10px; min-height:45px; padding:11px 14px; border:1px solid #e0e9f9; border-radius:9px; color:#8190a7; background:#eff4fc; font-size:10px; }
.notice-icon { width:16px; height:16px; color:#6487c7; }
.notice p { flex:1; margin:0; }
.notice strong { margin-right:5px; color:#6981a8; font-weight:600; }
.notice a { display:flex; align-items:center; gap:4px; flex:0 0 auto; color:#6685be; font-size:10px; }
.notice a:hover { color:var(--blue); }
.results-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:27px 0 23px; }
.results-left { display:flex; align-items:center; gap:9px; }
.results-left h2 { margin:0; font-size:12px; font-weight:600; color:#68778e; }
.result-count { padding-left:9px; border-left:1px solid #dce3ee; color:#9ca9bc; font-size:10px; }
.updated-at { color:#a3afc0; font-size:9px; }
.updated-at time { margin-left:5px; font-variant-numeric:tabular-nums; }
.resource-groups { min-height:160px; }
.resource-group { margin-bottom:29px; }
.group-heading { display:flex; align-items:center; gap:8px; margin-bottom:13px; }
.group-symbol { display:grid; place-items:center; width:25px; height:25px; border:1px solid #e1e9f8; border-radius:7px; color:#6c8cc5; background:#edf3fc; }
.group-symbol .icon { width:14px; height:14px; }
.group-heading h2 { margin:0; font-size:14px; font-weight:650; letter-spacing:-.2px; }
.group-count { padding-left:1px; color:#a4b0c3; font-size:10px; }
.group-description { margin:0 0 0 auto; color:#a3adbd; font-size:10px; }
.resource-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.resource-card { display:flex; flex-direction:column; position:relative; min-width:0; min-height:173px; border:1px solid #e5eaf2; border-radius:12px; background:white; box-shadow:0 2px 5px #1d385a02; transition:transform .22s var(--ease),border-color .22s,box-shadow .22s; }
.resource-card:hover,.resource-card:focus-within { transform:translateY(-3px); border-color:#c7d8f8; box-shadow:0 9px 22px #2e609b0c; }
.resource-main { display:block; flex:1; min-width:0; padding:17px 17px 0; border-radius:12px 12px 0 0; }
.resource-main:focus-visible { outline:0; }
.card-header { display:flex; align-items:center; gap:10px; min-height:36px; }
.resource-logo { display:grid; place-items:center; flex:0 0 36px; height:36px; border:1px solid #e9edf4; border-radius:9px; background:#f9fbff; color:#7290bd; font-size:11px; font-weight:600; overflow:hidden; }
.resource-logo img { display:block; width:24px; height:24px; object-fit:contain; }
.identity-copy { flex:1; min-width:0; }
.resource-name { margin:0; color:#334155; font-size:14px; font-weight:650; line-height:1.5; overflow-wrap:anywhere; }
.resource-domain { display:block; margin-top:3px; color:#abb5c5; font-size:9px; line-height:1.4; overflow-wrap:anywhere; }
.card-arrow { align-self:flex-start; margin-top:1px; color:#c0cbdc; transition:color .2s,translate .2s; }
.card-arrow .icon { width:14px; height:14px; }
.resource-card:hover .card-arrow,.resource-card:focus-within .card-arrow { color:#688ee0; translate:1px -1px; }
.resource-description { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; min-height:40px; margin:13px 0 0; color:#718096; font-size:12px; line-height:1.8; }
.card-footer { display:flex; align-items:center; justify-content:space-between; gap:7px; padding:9px 12px 10px 17px; }
.resource-tags { display:flex; align-items:center; flex-wrap:wrap; gap:4px 9px; min-width:0; color:#a5b1c4; font-size:9px; }
.resource-tag { white-space:nowrap; }
.resource-tag::before { content:"#"; margin-right:2px; color:#b9c7dc; }
.copy-link { display:grid; place-items:center; flex:0 0 28px; height:28px; padding:0; border:0; border-radius:6px; color:#afbdd2; background:transparent; transition:color .18s,background .18s; }
.copy-link .icon { width:14px; height:14px; }
.copy-link:hover,.copy-link.copied { color:#5b82d2; background:#edf3ff; }
.referral-label { display:inline-block; margin-left:4px; padding:1px 4px; vertical-align:middle; border:1px solid #dce6f9; border-radius:4px; color:#8aa3ce; font-size:8px; font-weight:400; white-space:nowrap; }
.invite-note { margin:0 16px 12px; border-top:1px solid #edf0f6; color:#9aa8bd; font-size:9px; }
.invite-note summary { cursor:pointer; padding:8px 0 0; color:#92a6c8; }
.invite-note p { margin:7px 0 0; line-height:1.85; }
.empty-state { padding:45px 20px 60px; border:1px dashed #dce5f3; border-radius:12px; text-align:center; }
.empty-state > .icon { width:32px; height:32px; color:#9ab3e2; }
.empty-state h3 { margin:13px 0 6px; font-size:16px; font-weight:600; }
.empty-state p { margin:0; color:#9ca9bd; font-size:12px; }
.empty-state button { margin-top:19px; padding:10px 17px; border:0; border-radius:7px; color:white; background:var(--blue); font-size:11px; }
.noscript { padding:20px; border:1px solid var(--line); border-radius:10px; }
.disclaimer-section { margin-top:37px; }
#disclaimer { scroll-margin-top:145px; border:1px solid #e5eaf3; border-radius:11px; background:white; }
#disclaimer summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px; cursor:pointer; list-style:none; }
#disclaimer summary::-webkit-details-marker { display:none; }
#disclaimer summary > span { display:flex; align-items:center; gap:9px; }
#disclaimer summary .icon { width:16px; height:16px; color:#8da4c9; }
#disclaimer summary strong { color:#7a8ba4; font-size:11px; font-weight:550; }
.summary-subtitle { margin-left:8px; color:#adb8c9; font-size:10px; }
.summary-chevron { transition:transform .2s; }
#disclaimer[open] .summary-chevron { transform:rotate(90deg); }
.disclaimer-content { max-width:920px; padding:0 23px 25px; color:#929fb4; font-size:11px; }
.disclaimer-lead { margin:0 0 20px; padding:12px 14px; border-left:2px solid #a6bff0; border-radius:0 5px 5px 0; color:#7a93bd; background:#f1f6ff; }
.disclaimer-content ol { margin:0; padding-left:19px; }
.disclaimer-content li { margin-top:17px; padding-left:6px; }
.disclaimer-content strong { color:#71839f; font-weight:600; }
.disclaimer-content li p { margin:5px 0 0; line-height:1.9; }
.footer { display:flex; align-items:center; justify-content:space-between; gap:25px; padding:25px 0 31px; color:#a8b4c6; font-size:9px; }
.footer > span { display:flex; align-items:center; gap:8px; }
.footer-brand { color:#7d93b4; font-size:13px; font-weight:650; }
.back-to-top { position:fixed; z-index:30; right:22px; bottom:22px; display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid #e0e8f4; border-radius:11px; color:#82a0ce; background:#ffffffed; box-shadow:0 4px 18px #284c7910; }
.back-to-top:hover { color:#4774d2; background:#edf4ff; }
.toast { position:fixed; z-index:60; left:50%; bottom:27px; max-width:calc(100vw - 40px); padding:11px 18px; border:1px solid #3c63a4; border-radius:9px; color:#fff; background:#345890; font-size:12px; opacity:0; transform:translate(-50%,10px); pointer-events:none; transition:opacity .2s,transform .2s; }
.toast.visible { opacity:1; transform:translate(-50%,0); }
@media (min-width:1350px) { .resource-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:1100px) {
  .workspace,.header-inner { padding-left:30px; padding-right:30px; }
  .resource-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
  .resource-main { padding:15px 15px 0; }
  .card-footer { padding-left:15px; }
  .resource-name { font-size:12px; }
  .resource-logo { flex-basis:32px; height:33px; border-radius:8px; }
  .resource-logo img { width:22px; height:22px; }
  .card-header { gap:8px; }
  .resource-domain { font-size:8px; }
  .category-button { padding:0 12px; }
  .group-description { font-size:9px; }
}
@media (max-width:900px) {
  .resource-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .resource-name { font-size:13px; }
  .resource-logo { flex-basis:36px; height:36px; }
  .resource-domain { font-size:9px; }
  .resource-logo img { width:24px; height:24px; }
  .category-button .icon { display:none; }
  .group-description { display:none; }
}
@media (max-width:560px) {
  html { scroll-padding-top:130px; }
  .header-inner { height:64px; padding:0 20px; }
  .brand-name { font-size:22px; }
  .brand-symbol { width:31px; height:32px; border-radius:9px; }
  .brand-symbol .icon { width:19px; height:19px; }
  .header-divider,.header-nav { display:none; }
  .motion-toggle { justify-content:center; min-width:44px; height:40px; padding:0 10px; }
  .motion-toggle > span { display:none; }
  .workspace { padding:27px 20px 0; }
  .page-heading { align-items:flex-start; gap:15px; margin-bottom:21px; }
  h1 { font-size:26px; }
  .page-description { max-width:245px; margin-top:9px; font-size:11px; line-height:1.9; }
  .collection-count { margin-top:5px; padding:5px 8px; gap:5px; border-radius:6px; font-size:9px; }
  .collection-count strong { font-size:12px; }
  .collection-count > span { display:none; }
  .collection-count::after { content:"个入口"; }
  .search-box { height:53px; padding:0 14px; gap:10px; border-radius:10px; }
  .search-box input { font-size:16px; }
  .search-box input::placeholder { font-size:12px; }
  .search-shortcut { display:none; }
  .search-icon { width:19px; height:19px; }
  .category-bar { top:63px; margin:9px -20px 8px; padding:9px 14px; }
  .category-nav { gap:1px; min-height:44px; }
  .category-indicator { height:44px; }
  .category-button { min-height:44px; padding:0 12px; gap:5px; font-size:10px; }
  .category-count { font-size:8px; margin-left:0; padding:0 2px; }
  .notice { display:grid; grid-template-columns:15px minmax(0,1fr); align-items:start; gap:6px 8px; padding:12px; font-size:10px; line-height:1.9; border-radius:8px; }
  .notice-icon { margin-top:3px; width:15px; height:15px; }
  .notice strong { display:none; }
  .notice a { grid-column:2; justify-self:start; font-size:9px; }
  .results-toolbar { margin:23px 0 20px; gap:10px; }
  .results-left { gap:7px; }
  .results-left h2 { font-size:11px; }
  .result-count { padding-left:7px; font-size:9px; }
  .updated-at { font-size:8px; }
  .updated-at .updated-label { display:none; }
  .resource-group { margin-bottom:25px; }
  .group-heading { gap:7px; margin-bottom:12px; }
  .group-heading h2 { font-size:13px; }
  .group-symbol { width:23px; height:23px; border-radius:6px; }
  .group-symbol .icon { width:13px; height:13px; }
  .group-count { font-size:9px; }
  .resource-grid { grid-template-columns:minmax(0,1fr); gap:11px; }
  .resource-card { min-height:169px; border-radius:11px; }
  .resource-main { padding:17px 17px 0; }
  .card-header { gap:11px; }
  .resource-logo { flex-basis:37px; height:37px; border-radius:9px; }
  .resource-logo img { width:25px; height:25px; }
  .resource-name { font-size:14px; }
  .resource-domain { margin-top:3px; font-size:10px; }
  .resource-description { margin-top:13px; font-size:12px; line-height:1.8; min-height:43px; }
  .card-arrow { margin-top:2px; }
  .card-arrow .icon { width:15px; height:15px; }
  .card-footer { padding:3px 10px 8px 17px; }
  .resource-tags { font-size:10px; gap:4px 11px; }
  .copy-link { flex-basis:44px; height:44px; }
  .referral-label { font-size:8px; }
  .invite-note { font-size:10px; }
  .disclaimer-section { margin-top:31px; }
  #disclaimer { scroll-margin-top:130px; }
  #disclaimer summary { padding:17px 13px; }
  #disclaimer summary > span { gap:7px; }
  #disclaimer summary strong { font-size:10px; }
  .summary-subtitle { display:none; }
  .disclaimer-content { padding:0 16px 24px; font-size:11px; }
  .footer { align-items:flex-start; gap:22px; padding:22px 0 28px; font-size:8px; }
  .footer .footer-external { max-width:88px; }
  .footer-brand { font-size:12px; }
  .back-to-top { right:14px; bottom:17px; }
  .toast { font-size:11px; }
}
@media (max-width:360px) { .workspace { padding-left:16px; padding-right:16px; } .header-inner { padding-left:16px; padding-right:16px; } .category-bar { margin-left:-16px; margin-right:-16px; padding-left:10px; padding-right:10px; } .resource-name { font-size:13px; } .collection-count { font-size:8px; } }
html[data-motion="off"] { scroll-behavior:auto; }
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after { animation:none!important; transition:none!important; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }