/* ============================================================
   二次元资料库 · 樱色玻璃视觉系统 v2
   暗色/明亮双主题 · 1000条番剧
   ============================================================ */

:root {
  --pink: #ff6b9d; --cyan: #ffb8d0; --violet: #c4a0ff;
  --yellow: #ffd76e; --green: #7bed9f; --red: #ff6b81;
  --ink: #f5f1ff; --ink-dim: #c8b8e8; --ink-faint: #9b8dc4;
  --bg: #12071f;
  --glass-bg: linear-gradient(135deg, rgba(255,140,180,.14), rgba(180,140,255,.05));
  --glass-brd: rgba(255,180,210,.25);
  --glass-shadow: 0 10px 40px rgba(20,4,40,.5), inset 0 1px 0 rgba(255,180,210,.35), inset 0 -1px 0 rgba(255,200,230,.05);
  --surface: rgba(255,255,255,.05); --surface-brd: rgba(255,180,210,.14);
  --r-lg: 26px; --r-md: 18px; --r-sm: 12px;
  --font-kawaii: "ZCOOL KuaiLe","PingFang SC","Microsoft YaHei",sans-serif;
  --font-body: "Nunito","PingFang SC","Microsoft YaHei",sans-serif;
  --font-mono: "JetBrains Mono",Consolas,monospace;
  --glow-pink: 0 0 20px rgba(255,107,157,.3);
  --glow-violet: 0 0 20px rgba(196,160,255,.3);
  --transition-fast: .2s cubic-bezier(.4,0,.2,1);
  --transition-medium: .35s cubic-bezier(.4,0,.2,1);
  --transition-bounce: .4s cubic-bezier(.34,1.56,.64,1);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-body); background:var(--bg); color:var(--ink); min-height:100vh; overflow-x:hidden; transition:background .45s,color .45s; line-height:1.6; }
::selection { background:rgba(255,107,157,.4); color:#fff; }
::-webkit-scrollbar { width:10px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(255,255,255,.15); border-radius:8px; border:2px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover { background:rgba(255,107,157,.45); background-clip:content-box; }
a { color:var(--pink); text-decoration:none; transition:color var(--transition-fast); }
a:hover { color:var(--violet); }
button { font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
input,textarea,select { font-family:inherit; color:var(--ink); }

/* ============ 背景场景 ============ */
.bg-scene { position:fixed; inset:0; z-index:-2; overflow:hidden; }
.blob { position:absolute; border-radius:50%; filter:blur(110px); opacity:.45; animation:blobFloat 22s ease-in-out infinite alternate; will-change:transform; }
.blob.b1 { width:55vw; height:55vw; background:#6b2a8e; top:-18vw; left:-12vw; }
.blob.b2 { width:40vw; height:40vw; background:#c23870; top:8vh; right:-14vw; animation-delay:-6s; }
.blob.b3 { width:38vw; height:38vw; background:#2a408e; bottom:-12vw; left:22vw; animation-delay:-12s; }
.blob.b4 { width:26vw; height:26vw; background:#6e2a7e; bottom:8vh; right:18vw; animation-delay:-3s; }
@keyframes blobFloat { 0%{transform:translate(0,0) scale(1);} 50%{transform:translate(4vw,-3vh) scale(1.12);} 100%{transform:translate(-3vw,4vh) scale(.94);} }
.bg-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(255,180,210,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,180,210,.03) 1px,transparent 1px); background-size:44px 44px; mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 75%); }
.star { position:absolute; color:#ffb8d0; opacity:.7; animation:twinkle 3s ease-in-out infinite; pointer-events:none; will-change:transform,opacity; }
@keyframes twinkle { 0%,100%{opacity:.12;transform:scale(.7);} 50%{opacity:.9;transform:scale(1.3);} }
.cursor-glow { position:fixed; width:480px; height:480px; border-radius:50%; pointer-events:none; z-index:-1; background:radial-gradient(circle,rgba(255,107,157,.08),transparent 65%); transform:translate(-50%,-50%); left:50vw; top:40vh; transition:left .18s ease-out,top .18s ease-out; }

/* ============ 玻璃拟态 ============ */
.glass { background:var(--glass-bg); -webkit-backdrop-filter:blur(26px) saturate(170%); backdrop-filter:blur(26px) saturate(170%); border:1px solid var(--glass-brd); border-radius:var(--r-lg); box-shadow:var(--glass-shadow); position:relative; }
.glass::before { content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(115deg,rgba(255,200,220,.22) 0%,rgba(255,180,210,.05) 22%,transparent 45%); pointer-events:none; }
.glass-soft { background:var(--surface); border:1px solid var(--surface-brd); border-radius:var(--r-md); transition:all var(--transition-medium); }
.glass-soft:hover { background:rgba(255,255,255,.08); border-color:var(--glass-brd); box-shadow:0 8px 24px rgba(255,107,157,.08); }

/* ============ 导航栏 ============ */
.glass-nav { position:fixed; top:16px; left:50%; transform:translateX(-50%); z-index:100; transition:transform var(--transition-medium),box-shadow var(--transition-medium); width:min(1240px,calc(100% - 32px)); display:flex; align-items:center; gap:16px; flex-wrap:wrap; row-gap:10px; padding:12px 22px; border-radius:22px; transition:all var(--transition-medium); }
.glass-nav:hover { box-shadow:0 14px 50px rgba(20,4,40,.6),inset 0 1px 0 rgba(255,180,210,.5); }
.logo { display:flex; align-items:baseline; gap:9px; white-space:nowrap; cursor:pointer; transition:transform var(--transition-fast); }
.logo:hover { transform:scale(1.03); }
.logo-pulse { width:12px; height:12px; border-radius:50%; background:linear-gradient(135deg,var(--pink),var(--violet)); box-shadow:0 0 12px var(--pink); animation:pulse 2s ease-in-out infinite; align-self:center; }
@keyframes pulse { 0%,100%{transform:scale(1);opacity:1;} 50%{transform:scale(1.35);opacity:.55;} }
.logo-name { font-family:var(--font-kawaii); font-size:21px; font-weight:700; color:var(--ink); }
.logo-name em { font-style:normal; background:linear-gradient(135deg,var(--pink),var(--violet)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.logo-sub { font-size:10.5px; color:var(--ink-faint); font-family:var(--font-mono); letter-spacing:1px; text-transform:uppercase; }
.nav-links { display:flex; gap:4px; flex:1; min-width:160px; }
.nav-btn { padding:8px 16px; border-radius:14px; font-size:14px; font-weight:600; color:var(--ink-dim); transition:all var(--transition-fast); position:relative; overflow:hidden; }
.nav-btn::after { content:""; position:absolute; bottom:0; left:50%; width:0; height:2px; background:linear-gradient(90deg,var(--pink),var(--violet)); transition:all var(--transition-fast); transform:translateX(-50%); border-radius:1px; }
.nav-btn:hover { color:var(--ink); background:rgba(255,255,255,.08); }
.nav-btn:hover::after { width:60%; }
.nav-btn.active { color:var(--pink); background:rgba(255,107,157,.12); }
.nav-btn.active::after { width:40%; }
.nav-search { display:flex; align-items:center; gap:6px; background:var(--surface); border:1px solid var(--surface-brd); border-radius:14px; padding:6px 14px; min-width:180px; transition:all var(--transition-fast); }
.nav-search:focus-within { border-color:var(--pink); box-shadow:0 0 0 3px rgba(255,107,157,.15); }
.nav-search input { border:none; background:none; outline:none; font-size:13px; width:100%; }
.s-icon { font-size:13px; flex-shrink:0; }
.theme-btn { width:40px; height:40px; border-radius:12px; font-size:18px; display:flex; align-items:center; justify-content:center; transition:all var(--transition-bounce); }
.theme-btn:hover { background:rgba(255,255,255,.1); transform:rotate(20deg) scale(1.1); }

/* ============ 页面容器 ============ */
.wrap { max-width:1240px; margin:0 auto; padding:0 24px; }
.page { padding-top:110px; min-height:100vh; }

/* ============ Hero 首页 ============ */
.hero { text-align:center; padding:40px 0 30px; animation:fadeUp .6s ease-out; }
@keyframes fadeUp { from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:none;} }
.hero-wave { font-size:48px; display:inline-block; animation:wave 2s ease-in-out infinite; }
@keyframes wave { 0%,100%{transform:rotate(0);} 25%{transform:rotate(20deg);} 75%{transform:rotate(-15deg);} }
.hero h1 { font-family:var(--font-kawaii); font-size:38px; margin:12px 0; background:linear-gradient(135deg,var(--pink),var(--violet),var(--cyan)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; background-size:200% 200%; animation:gradientShift 4s ease-in-out infinite; }
@keyframes gradientShift { 0%,100%{background-position:0% 50%;} 50%{background-position:100% 50%;} }
.hero-desc { color:var(--ink-dim); font-size:15px; line-height:2; margin-bottom:24px; }
.hero-search { position:relative; max-width:480px; margin:0 auto; }
.hero-search input { width:100%; padding:14px 20px 14px 44px; border-radius:18px; border:1px solid var(--glass-brd); background:var(--glass-bg); backdrop-filter:blur(20px); font-size:15px; outline:none; transition:all var(--transition-fast); }
.hero-search input:focus { border-color:var(--pink); box-shadow:0 0 0 4px rgba(255,107,157,.15),var(--glow-pink); }
.hero-search .s-icon { position:absolute; left:16px; top:50%; transform:translateY(-50%); font-size:16px; pointer-events:none; }

/* ============ 统计条 ============ */
.home-stats { padding:20px 0; }
.stats-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.stat-card { padding:18px; text-align:center; border-radius:var(--r-md); transition:all var(--transition-medium); }
.stat-card:hover { transform:translateY(-4px); box-shadow:0 12px 30px rgba(255,107,157,.12); }
.stat-num { font-family:var(--font-kawaii); font-size:28px; background:linear-gradient(135deg,var(--pink),var(--violet)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.stat-label { font-size:12px; color:var(--ink-faint); margin-top:4px; }

/* ============ 搜索下拉 ============ */
.search-drop { position:absolute; top:100%; left:0; right:0; margin-top:8px; background:rgba(18,7,31,.96); backdrop-filter:blur(20px); border:1px solid var(--glass-brd); border-radius:var(--r-md); max-height:340px; overflow-y:auto; z-index:50; display:none; box-shadow:0 16px 48px rgba(0,0,0,.5); }
.search-drop.open { display:block; animation:dropIn .2s ease-out; }
@keyframes dropIn { from{opacity:0;transform:translateY(-8px);} to{opacity:1;transform:none;} }
.sd-item { display:flex; align-items:center; gap:12px; padding:12px 16px; cursor:pointer; transition:all var(--transition-fast); border-bottom:1px solid rgba(255,255,255,.03); }
.sd-item:last-child { border-bottom:none; }
.sd-item:hover { background:rgba(255,107,157,.1); }
.sd-icon { font-size:22px; flex-shrink:0; }
.sd-name { font-size:14px; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sd-desc { font-size:11px; color:var(--ink-faint); margin-top:2px; }
.sd-empty { padding:24px; text-align:center; color:var(--ink-faint); font-size:13px; }

/* ============ 首页区块 ============ */
.home-section { margin:30px 0; animation:fadeUp .6s ease-out both; }
.home-section:nth-child(2) { animation-delay:.1s; }
.home-section:nth-child(3) { animation-delay:.2s; }
.section-header { display:flex; align-items:center; gap:12px; margin-bottom:18px; flex-wrap:wrap; }
.section-header h2 { font-family:var(--font-kawaii); font-size:20px; color:var(--ink); }
.section-badge { font-size:11px; padding:4px 12px; border-radius:999px; background:linear-gradient(135deg,rgba(255,107,157,.15),rgba(196,160,255,.15)); color:var(--ink-dim); border:1px solid rgba(255,107,157,.2); }

/* ============ 分类网格 ============ */
.category-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:12px; }
.cat-card { padding:20px 14px; text-align:center; cursor:pointer; transition:all var(--transition-bounce); border-radius:var(--r-md); }
.cat-card:hover { transform:translateY(-6px) scale(1.03); box-shadow:0 16px 40px rgba(255,107,157,.15); border-color:var(--glass-brd); }
.cat-icon { font-size:28px; margin-bottom:8px; transition:transform var(--transition-bounce); }
.cat-card:hover .cat-icon { transform:scale(1.2) rotate(-5deg); }
.cat-name { font-size:13px; font-weight:600; color:var(--ink); }
.cat-count { font-size:11px; color:var(--ink-faint); margin-top:4px; }

/* ============ 条目网格 ============ */
.entry-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; }

/* ============ 条目卡片 ============ */
.entry-card { padding:20px; cursor:pointer; transition:all var(--transition-medium); overflow:hidden; }
.entry-card::after { content:""; position:absolute; inset:0; border-radius:inherit; opacity:0; transition:opacity var(--transition-medium); background:linear-gradient(135deg,rgba(255,107,157,.06),rgba(196,160,255,.06)); pointer-events:none; }
.entry-card:hover { transform:translateY(-6px); box-shadow:0 20px 50px rgba(255,107,157,.15),0 0 0 1px rgba(255,107,157,.3),inset 0 1px 0 rgba(255,200,220,.5); }
.entry-card:hover::after { opacity:1; }
.entry-card-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.entry-cat { font-size:12px; font-weight:600; }
.entry-rating { font-size:12px; color:var(--yellow); font-weight:700; background:rgba(255,215,110,.1); padding:2px 8px; border-radius:8px; }
.entry-card-title { font-size:16px; font-weight:700; color:var(--ink); margin-bottom:8px; line-height:1.4; }
.entry-jp { font-size:12px; color:var(--ink-faint); font-weight:400; }
.entry-card-summary { font-size:13px; color:var(--ink-dim); line-height:1.7; margin-bottom:12px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.entry-card-footer { display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:12px; color:var(--ink-faint); }
.entry-card-footer span:first-child,
.entry-card-footer span:nth-child(2) { background:var(--surface); padding:2px 8px; border-radius:6px; border:1px solid var(--surface-brd); }
.entry-tags { display:flex; gap:4px; flex-wrap:wrap; }
.entry-tag { font-size:10px; padding:2px 8px; border-radius:6px; background:rgba(255,107,157,.08); color:var(--pink); border:1px solid rgba(255,107,157,.15); transition:all var(--transition-fast); }
.entry-card:hover .entry-tag { background:rgba(255,107,157,.15); }

/* ============ 条目列表页 ============ */
.entries-header { margin-bottom:24px; animation:fadeUp .4s ease-out; }
.entries-header h2 { font-family:var(--font-kawaii); font-size:22px; color:var(--ink); }

/* ============ 排序/分页/随机 ============ */
.entries-toolbar { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px; padding:12px 16px; border-radius:var(--r-sm); background:var(--surface); border:1px solid var(--surface-brd); }
.sort-group { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.sort-label { font-size:12px; color:var(--ink-faint); font-weight:600; }
.sort-btn { padding:6px 14px; border-radius:999px; font-size:12px; font-weight:600; background:transparent; border:1px solid var(--surface-brd); color:var(--ink-dim); transition:all var(--transition-fast); }
.sort-btn:hover { background:rgba(255,255,255,.08); border-color:var(--glass-brd); color:var(--ink); }
.sort-btn.active { background:linear-gradient(135deg,var(--pink),var(--violet)); color:#fff; border-color:transparent; box-shadow:0 4px 16px rgba(255,107,157,.3); }
.random-btn { padding:6px 16px; border-radius:999px; font-size:12px; font-weight:700; background:linear-gradient(135deg,#ffd76e,#ff6b9d); color:#1a0a1f; border:none; cursor:pointer; transition:all var(--transition-bounce); white-space:nowrap; }
.random-btn:hover { transform:scale(1.08); box-shadow:0 6px 20px rgba(255,215,110,.4); }
.random-btn:active { transform:scale(.95); }
.entries-count { font-size:14px; color:var(--ink-faint); font-weight:400; }

/* ============ 分类筛选 ============ */
.cat-filter { display:flex; gap:6px; flex-wrap:wrap; margin-top:14px; }
.cat-chip { padding:6px 14px; border-radius:999px; font-size:12px; font-weight:600; background:transparent; border:1px solid var(--surface-brd); color:var(--ink-dim); transition:all var(--transition-fast); cursor:pointer; white-space:nowrap; }
.cat-chip:hover { background:rgba(255,255,255,.08); border-color:var(--glass-brd); color:var(--ink); transform:translateY(-2px); }
.cat-chip.active { background:linear-gradient(135deg,var(--pink),var(--violet)); color:#fff; border-color:transparent; box-shadow:0 4px 16px rgba(255,107,157,.3); }

/* ============ 分页 ============ */
.pagination { display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; margin:30px auto; padding:14px 20px; border-radius:var(--r-md); background:var(--surface); border:1px solid var(--surface-brd); max-width:600px; animation:fadeUp .4s ease-out; }
.page-btn { width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:700; background:transparent; border:1px solid var(--surface-brd); color:var(--ink); cursor:pointer; transition:all var(--transition-bounce); }
.page-btn:hover:not(:disabled) { background:linear-gradient(135deg,var(--pink),var(--violet)); color:#fff; border-color:transparent; transform:scale(1.1); }
.page-btn:disabled { opacity:.3; cursor:default; }
.page-info { font-size:13px; color:var(--ink-dim); font-weight:600; min-width:100px; text-align:center; }
.page-jump { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-faint); }
.page-jump input { width:52px; padding:4px 8px; border-radius:8px; border:1px solid var(--surface-brd); background:var(--surface); color:var(--ink); font-size:12px; text-align:center; font-family:var(--font-mono); transition:all var(--transition-fast); }
.page-jump input:focus { border-color:var(--pink); box-shadow:0 0 0 3px rgba(255,107,157,.15); outline:none; }

/* ============ 详情页 ============ */
.detail-page { max-width:860px; margin:0 auto; animation:fadeUp .5s ease-out; }
.detail-card { padding:28px; margin-bottom:20px; }
.detail-back { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:12px; font-size:13px; font-weight:600; color:var(--ink-dim); background:var(--surface); border:1px solid var(--surface-brd); cursor:pointer; transition:all var(--transition-fast); margin-bottom:20px; }
.detail-back:hover { color:var(--pink); border-color:var(--glass-brd); transform:translateX(-4px); }
.detail-title { font-family:var(--font-kawaii); font-size:26px; color:var(--ink); margin-bottom:6px; }
.detail-jp { font-size:14px; color:var(--ink-faint); margin-bottom:16px; }
.detail-meta { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.detail-meta span { padding:4px 12px; border-radius:8px; font-size:12px; font-weight:600; background:var(--surface); border:1px solid var(--surface-brd); color:var(--ink-dim); }
.detail-tags { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:18px; }
.detail-tag { padding:4px 12px; border-radius:8px; font-size:12px; background:rgba(255,107,157,.1); color:var(--pink); border:1px solid rgba(255,107,157,.2); transition:all var(--transition-fast); }
.detail-tag:hover { background:rgba(255,107,157,.2); transform:translateY(-2px); }
.detail-summary { font-size:15px; color:var(--ink); line-height:2; margin-bottom:14px; padding:16px 20px; border-radius:var(--r-sm); background:rgba(255,107,157,.04); border-left:3px solid var(--pink); }
.detail-desc { font-size:14px; color:var(--ink-dim); line-height:2; }

/* ============ 图片搜索面板 ============ */
.img-search-panel { padding:24px; margin-bottom:20px; }
.img-search-panel h3 { font-family:var(--font-kawaii); font-size:17px; color:var(--ink); margin-bottom:14px; }
.img-search-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:10px; }
.img-search-item { display:flex; align-items:center; gap:10px; padding:12px 16px; border-radius:var(--r-sm); background:var(--surface); border:1px solid var(--surface-brd); transition:all var(--transition-medium); cursor:pointer; text-decoration:none; color:var(--ink-dim); }
.img-search-item:hover { background:rgba(255,255,255,.08); border-color:var(--pink); color:var(--ink); transform:translateY(-3px); box-shadow:0 8px 24px rgba(255,107,157,.1); }
.img-search-item .is-icon { font-size:20px; flex-shrink:0; }
.img-search-item .is-name { font-size:13px; font-weight:600; }
.img-search-item .is-desc { font-size:11px; color:var(--ink-faint); }
.img-search-item .is-arrow { margin-left:auto; color:var(--ink-faint); transition:transform var(--transition-fast); }
.img-search-item:hover .is-arrow { transform:translateX(4px); color:var(--pink); }

/* ============ 资料/链接 ============ */
.link-section { padding:24px; margin-bottom:20px; }
.link-section h3 { font-family:var(--font-kawaii); font-size:17px; color:var(--ink); margin-bottom:14px; }
.materials-list { display:flex; flex-direction:column; gap:8px; }
.material-item { display:flex; align-items:center; gap:14px; padding:12px 16px; border-radius:var(--r-sm); background:var(--surface); border:1px solid var(--surface-brd); transition:all var(--transition-medium); color:var(--ink-dim); }
.material-item:hover { background:rgba(255,255,255,.08); border-color:var(--glass-brd); color:var(--ink); transform:translateX(4px); }
.material-icon { font-size:18px; flex-shrink:0; }
.material-info { flex:1; }
.material-title { font-size:13px; font-weight:600; color:var(--ink); }
.material-arrow { color:var(--ink-faint); font-size:14px; transition:transform var(--transition-fast); }
.material-item:hover .material-arrow { transform:translateX(4px); color:var(--pink); }

/* ============ 相关推荐 ============ */
.related-section { padding:24px; margin-bottom:20px; }
.related-section h3 { font-family:var(--font-kawaii); font-size:17px; color:var(--ink); margin-bottom:14px; }

/* ============ 关于页 ============ */
.about-page { max-width:740px; margin:0 auto; animation:fadeUp .5s ease-out; }
.about-card { padding:24px 28px; margin-bottom:20px; }
.about-card h3 { font-family:var(--font-kawaii); font-size:17px; margin-bottom:10px; color:var(--ink); }
.about-card p { font-size:13.5px; line-height:2; color:var(--ink-dim); }
.img-source-list { display:flex; flex-direction:column; gap:8px; }
.img-source-item { font-size:13px; color:var(--ink-dim); display:flex; align-items:center; gap:8px; }
.img-source-item b { color:var(--ink); min-width:80px; }
.img-source-item .is-icon { font-size:18px; }
.about-table { width:100%; border-collapse:collapse; font-size:13.5px; }
.about-table th,.about-table td { padding:8px 0; text-align:left; border-top:1px dashed var(--surface-brd); }
.about-table th { color:var(--pink); font-weight:700; width:130px; }

/* ============ 空状态 ============ */
.empty-state { text-align:center; padding:60px 20px; animation:fadeUp .5s ease-out; }
.empty-state p { color:var(--ink-faint); font-size:14px; line-height:2; }
.empty-state .big { font-family:var(--font-kawaii); font-size:18px; color:var(--ink-dim); }

/* ============ 页脚 ============ */
footer { text-align:center; padding:40px 0 50px; color:var(--ink-faint); font-size:12.5px; line-height:2; border-top:1px solid var(--surface-brd); margin-top:40px; }
footer .f-mono { font-family:var(--font-mono); color:var(--ink-dim); font-size:13px; margin-bottom:8px; }

/* ============ 回到顶部 ============ */
.back-top { position:fixed; right:26px; bottom:26px; z-index:150; width:48px; height:48px; border-radius:16px; font-size:18px; font-weight:700; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transform:translateY(18px); transition:all var(--transition-bounce); }
.back-top.show { opacity:1; pointer-events:auto; transform:none; }
.back-top:hover { transform:translateY(-4px); box-shadow:var(--glow-pink); }

/* ============ Toast ============ */
.toast { position:fixed; bottom:34px; left:50%; transform:translateX(-50%) translateY(90px); z-index:300; padding:13px 26px; border-radius:999px; font-size:14px; font-weight:600; background:linear-gradient(135deg,rgba(255,107,157,.92),rgba(196,160,255,.92)); color:#1a0a1f; box-shadow:0 12px 34px rgba(255,107,157,.4); transition:transform .35s cubic-bezier(.2,.9,.3,1.2); backdrop-filter:blur(10px); }
.toast.show { transform:translateX(-50%) translateY(0); }

/* ============ 卡片入场动画 ============ */
.entry-card { animation:cardIn .4s ease-out both; }
.entry-card:nth-child(1) { animation-delay:0s; }
.entry-card:nth-child(2) { animation-delay:.05s; }
.entry-card:nth-child(3) { animation-delay:.1s; }
.entry-card:nth-child(4) { animation-delay:.15s; }
.entry-card:nth-child(5) { animation-delay:.2s; }
.entry-card:nth-child(6) { animation-delay:.25s; }
@keyframes cardIn { from{opacity:0;transform:translateY(16px) scale(.97);} to{opacity:1;transform:none;} }

/* ============ 明亮主题 ============ */
body.light { --ink:#2c1840; --ink-dim:#6b5090; --ink-faint:#9b80b8; --bg:#fdf2f8; --glass-bg:linear-gradient(135deg,rgba(255,255,255,.78),rgba(255,240,250,.45)); --glass-brd:rgba(255,180,210,.5); --glass-shadow:0 12px 36px rgba(180,100,150,.15),inset 0 1px 0 rgba(255,255,255,.95); --surface:rgba(255,255,255,.6); --surface-brd:rgba(200,150,190,.2); }
body.light .blob { opacity:.25; }
body.light .bg-grid { background-image:linear-gradient(rgba(180,100,150,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(180,100,150,.06) 1px,transparent 1px); }
body.light .star { color:var(--pink); }
body.light ::-webkit-scrollbar-thumb { background:rgba(180,100,150,.3); background-clip:content-box; }
body.light .nav-btn:hover { background:rgba(255,255,255,.55); }
body.light .entry-card:hover { box-shadow:0 16px 40px rgba(255,107,157,.12),0 0 0 1px rgba(255,107,157,.3),inset 0 1px 0 rgba(255,200,220,.9); }
body.light .hero-search input { color:var(--ink); }
body.light .search-drop { background:rgba(255,248,252,.98); }
body.light .img-search-item:hover { background:rgba(255,255,255,.6); }
body.light .glass-soft:hover { background:rgba(255,255,255,.8); box-shadow:0 8px 24px rgba(255,107,157,.1); }
body.light footer { border-top-color:rgba(200,150,190,.3); }

/* ============ 响应式 ============ */
@media (max-width:1020px) {
  .stats-strip { grid-template-columns:repeat(2,1fr); }
  .entry-grid { grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); }
  .category-grid { grid-template-columns:repeat(auto-fill,minmax(100px,1fr)); }
}
@media (max-width:680px) {
  .entries-toolbar { flex-direction:column; align-items:stretch; }
  .sort-group { justify-content:center; }
  .pagination { gap:6px; padding:10px; }
  .page-jump { display:none; }
  .nav-search { display:none; }
  .logo-sub { display:none; }
  .stats-strip { grid-template-columns:repeat(2,1fr); }
  .entry-grid { grid-template-columns:1fr; }
  .page { padding-top:128px; }
  .hero h1 { font-size:26px; }
  .hero-search { min-width:auto; width:100%; }
  .detail-card { padding:20px; }
  .detail-title { font-size:20px; }
  .img-search-grid { grid-template-columns:1fr 1fr; }
  .category-grid { grid-template-columns:repeat(3,1fr); }
  .cat-filter { gap:4px; }
  .cat-chip { padding:5px 10px; font-size:11px; }
  .hero-wave { font-size:36px; }
  .hero-desc { font-size:13px; }
}
@media (max-width:400px) {
  .entry-grid { grid-template-columns:1fr; }
  .img-search-grid { grid-template-columns:1fr; }
  .category-grid { grid-template-columns:repeat(2,1fr); }
  .stats-strip { grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;} html{scroll-behavior:auto;} }


/* ============================================================
   移动端专属样式
   ============================================================ */

/* ============ 汉堡菜单按钮 ============ */
.hamburger { display:none; width:40px; height:40px; border-radius:12px; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:8px; transition:all var(--transition-fast); }
.hamburger span { display:block; width:20px; height:2px; background:var(--ink); border-radius:1px; transition:all var(--transition-medium); transform-origin:center; }
.hamburger:hover { background:rgba(255,255,255,.08); }
.hamburger.active span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity:0; transform:scaleX(0); }
.hamburger.active span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ============ 导航右侧 ============ */
.nav-right { display:flex; align-items:center; gap:8px; margin-left:auto; }

/* ============ 移动端菜单遮罩 ============ */
.mobile-menu-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); backdrop-filter:blur(4px); z-index:95; opacity:0; transition:opacity var(--transition-medium); }
.mobile-menu-overlay.show { display:block; opacity:1; }

/* ============ 移动端搜索栏 ============ */
.mobile-search { display:none; position:fixed; top:0; left:0; right:0; z-index:200; background:var(--bg); padding:12px 16px; transform:translateY(-100%); transition:transform var(--transition-medium); border-bottom:1px solid var(--surface-brd); }
.mobile-search.show { display:block; transform:translateY(0); }
.mobile-search-inner { display:flex; align-items:center; gap:10px; background:var(--surface); border:1px solid var(--surface-brd); border-radius:14px; padding:10px 16px; }
.mobile-search-inner input { flex:1; border:none; background:none; outline:none; font-size:15px; color:var(--ink); }
.mobile-search-close { width:32px; height:32px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--ink-faint); transition:all var(--transition-fast); }
.mobile-search-close:hover { background:rgba(255,107,157,.1); color:var(--pink); }
.mobile-search .search-drop { position:relative; margin-top:8px; max-height:50vh; }

/* ============ 移动端底部导航 ============ */
.mobile-bottom-nav { display:none; position:fixed; bottom:0; left:0; right:0; z-index:100; background:rgba(18,7,31,.92); backdrop-filter:blur(20px) saturate(180%); border-top:1px solid var(--glass-brd); padding:6px 8px calc(6px + env(safe-area-inset-bottom)); justify-content:space-around; }
.mbn-btn { display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 12px; border-radius:12px; font-size:10px; color:var(--ink-faint); transition:all var(--transition-fast); min-width:56px; }
.mbn-btn:hover,.mbn-btn.active { color:var(--pink); background:rgba(255,107,157,.08); }
.mbn-icon { font-size:20px; line-height:1; }
.mbn-label { font-weight:600; }

body.light .mobile-bottom-nav { background:rgba(253,242,248,.92); }
body.light .hamburger span { background:var(--ink); }

/* ============ 移动端断点 ============ */
@media (max-width:768px) {
  /* 导航 */
  .hamburger { display:flex; }
  .nav-links { display:none; position:fixed; top:70px; left:16px; right:16px; z-index:101; background:rgba(18,7,31,.96); backdrop-filter:blur(20px); border:1px solid var(--glass-brd); border-radius:var(--r-md); padding:12px; flex-direction:column; gap:4px; box-shadow:0 16px 48px rgba(0,0,0,.5); transform:translateY(-10px); opacity:0; transition:all var(--transition-medium); pointer-events:none; }
  .nav-links.open { display:flex; transform:translateY(0); opacity:1; pointer-events:auto; }
  .nav-links .nav-btn { padding:12px 16px; border-radius:12px; font-size:15px; text-align:left; }
  .nav-search { display:none; }
  .mobile-bottom-nav { display:flex; }

  /* 主内容留出底部空间 */
  main.page { padding-bottom:calc(70px + env(safe-area-inset-bottom)); }

  /* Hero */
  .hero { padding:24px 0 20px; }
  .hero h1 { font-size:24px; }
  .hero-desc { font-size:13px; margin-bottom:16px; }
  .hero-search input { padding:12px 16px 12px 40px; font-size:14px; border-radius:14px; }

  /* 统计条 */
  .stats-strip { grid-template-columns:repeat(2,1fr); gap:10px; }
  .stat-card { padding:14px 10px; }
  .stat-num { font-size:22px; }
  .stat-label { font-size:11px; }

  /* 分类网格 */
  .category-grid { grid-template-columns:repeat(4,1fr); gap:8px; }
  .cat-card { padding:14px 8px; }
  .cat-icon { font-size:22px; margin-bottom:6px; }
  .cat-name { font-size:11px; }
  .cat-count { font-size:10px; }

  /* 条目网格 */
  .entry-grid { grid-template-columns:1fr; gap:12px; }
  .entry-card { padding:16px; }
  .entry-card-title { font-size:15px; }
  .entry-card-summary { font-size:13px; -webkit-line-clamp:2; }
  .entry-card-footer { font-size:11px; }

  /* 详情页 */
  .detail-page { padding:0 4px; }
  .detail-card { padding:18px; }
  .detail-title { font-size:20px; }
  .detail-jp { font-size:13px; }
  .detail-summary { font-size:14px; padding:12px 14px; }
  .detail-desc { font-size:13px; }
  .detail-back { padding:8px 14px; font-size:12px; }

  /* 图片搜索 */
  .img-search-panel { padding:18px; }
  .img-search-grid { grid-template-columns:1fr; gap:8px; }
  .img-search-item { padding:14px; }

  /* 资料链接 */
  .link-section { padding:18px; }
  .material-item { padding:12px; gap:10px; }

  /* 排序/筛选 */
  .entries-toolbar { padding:10px 12px; gap:10px; }
  .sort-btn { padding:5px 10px; font-size:11px; }
  .random-btn { padding:5px 12px; font-size:11px; }
  .cat-filter { gap:4px; }
  .cat-chip { padding:5px 10px; font-size:11px; }

  /* 分页 */
  .pagination { padding:10px 14px; gap:6px; margin:20px auto; }
  .page-btn { width:34px; height:34px; font-size:13px; }
  .page-info { font-size:12px; min-width:80px; }

  /* 关于页 */
  .about-card { padding:18px; }
  .about-card h3 { font-size:15px; }
  .about-card p { font-size:13px; }

  /* 页脚 */
  footer { padding:30px 16px calc(30px + env(safe-area-inset-bottom)); font-size:11px; }

  /* 回到顶部 */
  .back-top { right:16px; bottom:calc(80px + env(safe-area-inset-bottom)); width:42px; height:42px; border-radius:14px; font-size:16px; }

  /* Toast */
  .toast { bottom:calc(80px + env(safe-area-inset-bottom)); font-size:13px; padding:10px 20px; }
}

/* ============ 超小屏幕 ============ */
@media (max-width:400px) {
  .glass-nav { padding:10px 14px; gap:10px; }
  .logo-name { font-size:18px; }
  .hero h1 { font-size:20px; }
  .hero-desc { font-size:12px; }
  .stats-strip { gap:8px; }
  .stat-card { padding:12px 8px; }
  .stat-num { font-size:20px; }
  .category-grid { grid-template-columns:repeat(4,1fr); gap:6px; }
  .cat-card { padding:12px 6px; }
  .cat-icon { font-size:20px; }
  .entry-card { padding:14px; }
  .detail-card { padding:14px; }
  .detail-title { font-size:18px; }
  .mbn-btn { padding:4px 8px; min-width:48px; }
  .mbn-icon { font-size:18px; }
  .mbn-label { font-size:9px; }
}

/* ============ 横屏适配 ============ */
@media (max-height:500px) and (orientation:landscape) {
  .hero { padding:16px 0; }
  .hero h1 { font-size:20px; }
  .hero-wave { font-size:28px; }
  .hero-desc { display:none; }
  .mobile-bottom-nav { padding:4px 8px; }
  .mbn-label { display:none; }
  .mbn-icon { font-size:22px; }
}

/* ============ 触摸优化 ============ */
@media (hover:none) and (pointer:coarse) {
  .entry-card:hover { transform:none; box-shadow:var(--glass-shadow); }
  .entry-card:active { transform:scale(.98); box-shadow:0 4px 16px rgba(255,107,157,.2); }
  .cat-card:hover { transform:none; }
  .cat-card:active { transform:scale(.95); }
  .glass-soft:hover { transform:none; }
  .glass-soft:active { transform:scale(.98); }
  .nav-btn:hover { background:none; }
  .nav-btn:active { background:rgba(255,107,157,.12); }
  .sort-btn:hover { background:transparent; }
  .sort-btn:active { background:rgba(255,255,255,.1); }
  .random-btn:active { transform:scale(.95); }
  .mbn-btn:active { transform:scale(.9); }
}

