/* ===== 主题变量 ===== */
:root, :root[data-theme="dark"] {
  --bg-base:#0b1220; --glow-a:rgba(56,189,248,.13); --glow-b:rgba(45,212,191,.10); --glow-c:rgba(129,140,248,.07);
  --grid-line:rgba(34,211,238,.055); --scan:rgba(34,211,238,.07);
  --panel:rgba(15,23,42,.82); --panel-solid:#0f172a; --panel-border:rgba(34,211,238,.22);
  --card:rgba(15,23,42,.78); --card-border:#1e293b; --card-hover:#22d3ee;
  --text-main:#f1f5f9; --text-sub:#94a3b8; --text-dim:#64748b;
  --accent:#22d3ee; --accent-soft:rgba(34,211,238,.14);
  --header-bg:rgba(11,18,32,.82); --field-bg:#1e293b; --field-border:#334155;
  --title-grad:linear-gradient(90deg,#67e8f9,#38bdf8,#5eead4);
  --time-grad:linear-gradient(90deg,#22d3ee,#60a5fa,#5eead4);
  --mask-opacity:1; --day-hover:#1e293b;
}
:root[data-theme="light"] {
  --bg-base:#eef4fb; --glow-a:rgba(14,165,233,.16); --glow-b:rgba(20,184,166,.13); --glow-c:rgba(99,102,241,.10);
  --grid-line:rgba(2,132,199,.09); --scan:rgba(2,132,199,.06);
  --panel:rgba(255,255,255,.86); --panel-solid:#ffffff; --panel-border:rgba(2,132,199,.28);
  --card:rgba(255,255,255,.9); --card-border:#dbe6f2; --card-hover:#0891b2;
  --text-main:#0f172a; --text-sub:#475569; --text-dim:#94a3b8;
  --accent:#0891b2; --accent-soft:rgba(8,145,178,.12);
  --header-bg:rgba(255,255,255,.85); --field-bg:#f1f5f9; --field-border:#cbd5e1;
  --title-grad:linear-gradient(90deg,#0e7490,#0369a1,#0f766e);
  --time-grad:linear-gradient(90deg,#0e7490,#2563eb,#0f766e);
  --mask-opacity:.82; --day-hover:#e2e8f0;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { background-color:var(--bg-base); background-image:radial-gradient(1100px 700px at 85% -10%,var(--glow-a),transparent 60%),radial-gradient(900px 650px at 8% 110%,var(--glow-b),transparent 60%),radial-gradient(700px 500px at 50% 50%,var(--glow-c),transparent 60%); background-attachment:fixed; transition:background-color .4s; }
body { background:transparent; color:var(--text-main); min-height:100vh; font-family:'Rajdhani',system-ui,-apple-system,'PingFang SC','Microsoft YaHei',sans-serif; font-size:15px; }
.tech-title,.ym,.live-time,.btn-tech,.search-kbd,.wp-temp { font-family:'Orbitron','Rajdhani',system-ui,sans-serif; }
/* ===== 壁纸层 + 遮罩（canvas 仍在其上，不影响动态背景） ===== */
#wallpaperLayer { position:fixed; inset:0; z-index:-4; background-size:cover; background-position:center; opacity:0; transition:opacity .8s ease; }
#wallpaperLayer.active { opacity:1; }
#wallpaperScrim { position:fixed; inset:0; z-index:-4; background:linear-gradient(180deg,rgba(11,18,32,.45),rgba(11,18,32,.62)); opacity:0; transition:opacity .8s ease; pointer-events:none; }
#wallpaperLayer.active + #wallpaperScrim { opacity:1; }
#bgCanvas { position:fixed; inset:0; z-index:-3; display:block; }
body::before { content:''; position:fixed; inset:0; z-index:-2; pointer-events:none; background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px); background-size:44px 44px; -webkit-mask-image:radial-gradient(ellipse at 50% 120%,#000 0%,transparent 78%); mask-image:radial-gradient(ellipse at 50% 120%,#000 0%,transparent 78%); animation:gridDrift 26s linear infinite; }
@keyframes gridDrift { to { background-position:0 44px,44px 0; } }
body::after { content:''; position:fixed; left:0; right:0; height:140px; z-index:-1; pointer-events:none; background:linear-gradient(180deg,transparent,var(--scan),transparent); animation:scanSweep 9s linear infinite; }
@keyframes scanSweep { 0%{top:-18%;} 100%{top:112%;} }
::-webkit-scrollbar { width:6px; height:6px; } ::-webkit-scrollbar-track{background:transparent;} ::-webkit-scrollbar-thumb{background:var(--field-border);border-radius:8px;} ::-webkit-scrollbar-thumb:hover{background:var(--accent);}
/* ===== 框架 ===== */
.app-header { background:var(--header-bg); backdrop-filter:blur(14px); border-bottom:1px solid var(--panel-border); }
.app-aside { background:color-mix(in srgb,var(--panel-solid) 45%,transparent); border-right:1px solid var(--panel-border); }
.app-footer { background:var(--header-bg); border-top:1px solid var(--panel-border); }
.tech-title { font-weight:900; letter-spacing:.04em; background:var(--title-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.live-time { background:var(--time-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.search-shell { background:var(--panel); border:1px solid var(--panel-border); border-radius:12px; transition:border-color .25s,box-shadow .25s; }
.search-shell:focus-within { border-color:var(--accent); box-shadow:0 0 16px var(--accent-soft); }
.engine-select { background:var(--field-bg); color:var(--text-main); font-size:.75rem; padding:.5rem .6rem; border-radius:8px; border:1px solid var(--field-border); outline:none; cursor:pointer; }
.search-input { width:100%; background:transparent; padding:.4rem .75rem; font-size:.875rem; color:var(--text-main); outline:none; }
.search-input::placeholder { color:var(--text-dim); }
.search-kbd { font-size:.65rem; color:var(--text-dim); border:1px solid var(--field-border); border-radius:5px; padding:1px 7px; margin-right:6px; }
.clock-shell { background:var(--panel); border:1px solid var(--panel-border); padding:.4rem .9rem; border-radius:12px; backdrop-filter:blur(8px); }
.clock-icon { display:flex; align-items:center; justify-content:center; width:2.25rem; height:2.25rem; border-radius:8px; background:linear-gradient(135deg,#06b6d4,#2563eb); color:#fff; box-shadow:0 4px 12px rgba(6,182,212,.35); }
.week-pill { padding:.1rem .45rem; border-radius:999px; background:var(--accent-soft); color:var(--accent); border:1px solid var(--panel-border); }
.holiday-pill { font-size:10px; padding:.1rem .45rem; border-radius:999px; background:rgba(244,63,94,.15); color:#fb7185; border:1px solid rgba(244,63,94,.4); animation:holidayPulse 2s infinite; }
@keyframes holidayPulse { 0%,100%{box-shadow:0 0 0 0 rgba(244,63,94,.3);} 50%{box-shadow:0 0 8px 2px rgba(244,63,94,.25);} }
@keyframes clockGlow { 0%,100%{box-shadow:0 0 14px rgba(34,211,238,.08);} 50%{box-shadow:0 0 26px rgba(56,189,248,.22);} }
.clock-card-anim { animation:clockGlow 5s ease-in-out infinite; }
.colon-pulse { animation:colonPulse 1.2s infinite; } @keyframes colonPulse { 0%,100%{opacity:1;} 50%{opacity:.2;} }
.calendar-expand { cursor:pointer; transition:all .2s; } .calendar-expand:hover { transform:scale(1.02); border-color:var(--accent); }
/* ===== 天气组件（放大版） ===== */
.weather-pill { display:inline-flex; align-items:center; gap:9px; background:var(--panel); border:1px solid var(--panel-border); padding:8px 16px; border-radius:14px; white-space:nowrap; line-height:1; transition:.25s; backdrop-filter:blur(8px); }
.weather-pill i { color:var(--accent); font-size:1.05rem; }
.weather-pill .wp-temp { font-size:1.15rem; font-weight:700; letter-spacing:.02em; color:var(--text-main); }
.weather-pill .wp-desc { font-size:.72rem; font-weight:600; color:var(--text-sub); border-left:1px solid var(--field-border); padding-left:9px; }
.weather-pill:hover { border-color:var(--accent); filter:drop-shadow(0 0 8px var(--accent-soft)); transform:translateY(-1px); }
/* ===== 语言选择器 ===== */
.lang-wrap { position:relative; display:inline-flex; align-items:center; }
.lang-globe { position:absolute; left:9px; font-size:.68rem; color:var(--accent); pointer-events:none; z-index:1; }
.lang-select { appearance:none; -webkit-appearance:none; background:var(--panel); border:1px solid var(--panel-border); color:var(--text-main); font-size:.7rem; font-weight:600; padding:6px 26px 6px 26px; border-radius:999px; cursor:pointer; outline:none; transition:.25s; background-image:linear-gradient(45deg,transparent 50%,var(--accent) 50%),linear-gradient(135deg,var(--accent) 50%,transparent 50%); background-position:calc(100% - 14px) 55%,calc(100% - 10px) 55%; background-size:4px 4px; background-repeat:no-repeat; }
.lang-select:hover { border-color:var(--accent); filter:drop-shadow(0 0 7px var(--accent-soft)); }
.lang-select option { background:var(--panel-solid); color:var(--text-main); }
.icon-btn { width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; color:var(--text-sub); background:var(--panel); border:1px solid var(--panel-border); cursor:pointer; clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px); transition:color .2s,border-color .2s,filter .25s,transform .15s; font-size:.8rem; }
.icon-btn:hover { color:var(--accent); border-color:var(--accent); filter:drop-shadow(0 0 7px var(--accent-soft)); transform:translateY(-1px); }
.admin-entry { display:inline-flex; align-items:center; gap:5px; color:var(--text-dim); font-size:11px; cursor:pointer; background:none; border:1px solid transparent; padding:2px 10px; border-radius:999px; transition:.25s; }
.admin-entry:hover { color:var(--accent); border-color:var(--panel-border); background:var(--accent-soft); }
/* ===== 按钮 ===== */
.btn-tech { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.45rem; padding:.55rem 1.15rem; font-size:.72rem; font-weight:700; letter-spacing:.08em; color:var(--accent); text-transform:uppercase; white-space:nowrap; cursor:pointer; background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 16%,transparent),color-mix(in srgb,var(--accent) 5%,transparent)); border:1px solid color-mix(in srgb,var(--accent) 45%,transparent); clip-path:polygon(11px 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%,0 11px); transition:color .25s,background .25s,border-color .25s,filter .25s,transform .18s; overflow:hidden; }
.btn-tech::before { content:''; position:absolute; top:0; left:-85%; width:55%; height:100%; background:linear-gradient(105deg,transparent,color-mix(in srgb,var(--accent) 35%,transparent),transparent); transform:skewX(-22deg); transition:left .5s ease; }
.btn-tech:hover::before { left:130%; }
.btn-tech:hover { color:var(--text-main); border-color:var(--accent); filter:drop-shadow(0 0 9px color-mix(in srgb,var(--accent) 55%,transparent)); transform:translateY(-1px); }
.btn-tech:active { transform:translateY(0) scale(.97); }
.btn-tech-primary { background:linear-gradient(180deg,#06b6d4,#0284c7); color:#fff; border-color:rgba(165,243,252,.75); }
.btn-tech-primary:hover { color:#fff; }
.btn-tech-admin { background:linear-gradient(180deg,rgba(147,51,234,.9),rgba(109,40,217,.9)); color:#f3e8ff; border-color:rgba(216,180,254,.7); }
.btn-tech-admin:hover { color:#fff; filter:drop-shadow(0 0 9px rgba(168,85,247,.6)); }
.btn-tech-sm { padding:.4rem .9rem; font-size:.66rem; }
/* ===== 管理员登录/注册切换 + 账号管理 ===== */
.auth-tabs { display:flex; gap:6px; }
.auth-tab { flex:1; padding:7px 0; font-size:.75rem; font-weight:700; letter-spacing:.06em; color:var(--text-dim); background:var(--field-bg); border:1px solid var(--field-border); border-radius:8px; cursor:pointer; transition:.2s; }
.auth-tab:hover { color:var(--text-main); }
.auth-tab.active { color:#fff; background:linear-gradient(180deg,rgba(147,51,234,.9),rgba(109,40,217,.9)); border-color:rgba(216,180,254,.6); box-shadow:0 0 12px rgba(168,85,247,.3); }
.auth-error { font-size:.72rem; color:#f87171; background:rgba(248,113,113,.1); border:1px solid rgba(248,113,113,.3); border-radius:8px; padding:7px 10px; display:flex; align-items:center; gap:6px; }
.auth-error.hidden { display:none; }
.auth-success { font-size:.72rem; color:#34d399; background:rgba(52,211,153,.1); border:1px solid rgba(52,211,153,.3); border-radius:8px; padding:7px 10px; display:flex; align-items:center; gap:6px; }
.auth-success.hidden { display:none; }
.auth-note { font-size:11px; line-height:1.5; color:rgba(251,191,36,.9); background:rgba(251,191,36,.08); border:1px solid rgba(251,191,36,.2); border-radius:8px; padding:8px; }
.acct-row { display:flex; align-items:center; gap:8px; background:var(--field-bg); border:1px solid var(--field-border); border-radius:8px; padding:7px 10px; font-size:.78rem; color:var(--text-main); }
.acct-badge { font-size:.62rem; color:#c084fc; background:rgba(168,85,247,.12); border:1px solid rgba(168,85,247,.35); padding:1px 8px; border-radius:999px; white-space:nowrap; }
.acct-del { color:var(--text-dim); padding:3px 6px; border-radius:6px; transition:.15s; cursor:pointer; background:none; border:none; }
.acct-del:hover { color:#f87171; background:rgba(248,113,113,.1); }
/* ===== 壁纸图库 ===== */
.wp-cats { display:flex; gap:6px; flex-wrap:wrap; }
.wp-cat { padding:5px 16px; font-size:.72rem; font-weight:700; color:var(--text-dim); background:var(--field-bg); border:1px solid var(--field-border); border-radius:999px; cursor:pointer; transition:.2s; }
.wp-cat:hover { color:var(--text-main); border-color:var(--accent); }
.wp-cat.active { color:#fff; background:linear-gradient(180deg,#06b6d4,#0284c7); border-color:rgba(165,243,252,.7); box-shadow:0 0 10px rgba(34,211,238,.35); }
.wp-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:8px; max-height:320px; overflow-y:auto; padding-right:4px; }
.wp-item { position:relative; aspect-ratio:16/9; border-radius:8px; overflow:hidden; cursor:pointer; border:2px solid var(--field-border); transition:.22s; }
.wp-item img,.wp-item .wp-thumb { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.wp-item:hover { border-color:var(--accent); transform:translateY(-2px); box-shadow:0 6px 16px rgba(0,0,0,.4),0 0 12px var(--accent-soft); }
.wp-item:hover img,.wp-item:hover .wp-thumb { transform:scale(1.08); }
.wp-item .wp-name { position:absolute; left:0; right:0; bottom:0; font-size:.6rem; color:#fff; padding:8px 6px 4px; background:linear-gradient(180deg,transparent,rgba(0,0,0,.75)); opacity:0; transition:.25s; }
.wp-item:hover .wp-name { opacity:1; }
.wp-item.current { border-color:#fbbf24; box-shadow:0 0 12px rgba(251,191,36,.4); }
/* ===== 卡片 / 收藏 / 置顶 / 分类管理 ===== */
.card-hover { background:var(--card); border:1px solid var(--card-border); backdrop-filter:blur(6px); transition:all .2s ease; }
.card-hover:hover { transform:translateY(-3px); border-color:var(--card-hover); box-shadow:0 10px 25px -8px color-mix(in srgb,var(--card-hover) 40%,transparent); }
.card-hover h3 { color:var(--text-main); } .card-hover:hover h3 { color:var(--accent); } .card-hover p { color:var(--text-sub); }
.card-actions { display:flex; gap:2px; opacity:0; transition:opacity .2s; }
.card-hover:hover .card-actions { opacity:1; }
.act-btn { color:var(--text-dim); padding:4px; border-radius:6px; transition:.15s; font-size:11px; cursor:pointer; }
.act-btn:hover { background:var(--field-bg); color:var(--accent); }
.act-btn.fav-on { color:#fbbf24; }
.act-btn.pin-on { color:#f472b6; }
.act-btn.del:hover { color:#f87171; }
.link-card.is-pinned { border-color:rgba(244,114,182,.4); }
.pin-flag { position:absolute; top:-1px; left:-1px; font-size:9px; color:#f472b6; background:rgba(244,114,182,.12); border:1px solid rgba(244,114,182,.35); border-radius:6px 0 8px 0; padding:2px 6px; }
.link-card { cursor:grab; } .link-card.dragging { opacity:.35; border-style:dashed; border-color:var(--accent); }
.drop-indicator { height:3px; border-radius:2px; margin:6px 4px; background:var(--accent); box-shadow:0 0 10px var(--accent); animation:dropPulse 1s infinite; }
@keyframes dropPulse { 0%,100%{opacity:.5;} 50%{opacity:1;} }
.drag-hint { font-size:10px; color:var(--text-dim); display:inline-flex; align-items:center; gap:4px; }
.cat-tools { display:none; gap:2px; }
.category-item:hover .cat-tools { display:inline-flex; }
.cat-tool { color:var(--text-dim); font-size:10px; padding:2px 5px; border-radius:5px; cursor:pointer; transition:.15s; }
.cat-tool:hover { color:var(--accent); background:var(--field-bg); }
.cat-tool.danger:hover { color:#f87171; }
.add-cat-btn { width:100%; margin-top:6px; padding:7px; font-size:.72rem; color:var(--text-dim); border:1px dashed var(--field-border); border-radius:8px; cursor:pointer; transition:.2s; display:flex; align-items:center; justify-content:center; gap:6px; }
.add-cat-btn:hover { color:var(--accent); border-color:var(--accent); background:var(--accent-soft); }
.fav-star { color:#fbbf24; margin-right:4px; }
/* ===== 弹窗 ===== */
.modal-mask { position:fixed; inset:0; z-index:9998; display:flex; align-items:center; justify-content:center; background:rgba(4,8,18,.6); backdrop-filter:blur(6px); opacity:var(--mask-opacity); }
.modal-mask.hidden { display:none; }
.modal-panel { background:var(--panel-solid); border:1px solid var(--panel-border); border-radius:14px; color:var(--text-main); box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 40px var(--accent-soft); animation:modalIn .22s cubic-bezier(.34,1.4,.64,1); }
.modal-panel-admin { border-color:rgba(168,85,247,.35); }
@keyframes modalIn { from{transform:translateY(14px) scale(.97);opacity:0;} to{transform:none;opacity:1;} }
.field-input { width:100%; background:var(--field-bg); border:1px solid var(--field-border); border-radius:8px; padding:.6rem .75rem; font-size:.85rem; color:var(--text-main); outline:none; transition:border-color .2s; }
.field-input:focus { border-color:var(--accent); }
/* ===== 豪华万年历 ===== */
.calendar-popup { position:fixed; inset:0; z-index:999; background:color-mix(in srgb,var(--bg-base) 85%,transparent); backdrop-filter:blur(8px); display:none; justify-content:center; align-items:center; }
.calendar-popup.active { display:flex; }
.calendar-popup-inner { background:var(--panel-solid); border:1px solid var(--panel-border); border-radius:1.25rem; padding:1.8rem 2.2rem; max-width:620px; width:94%; color:var(--text-main); box-shadow:0 30px 60px rgba(0,0,0,.6),0 0 40px var(--accent-soft); position:relative; animation:modalIn .22s ease; }
.calendar-popup-inner .close-cal { position:absolute; top:12px; right:18px; font-size:1.8rem; color:var(--text-sub); cursor:pointer; transition:.2s; background:none; border:none; }
.calendar-popup-inner .close-cal:hover { color:var(--text-main); transform:rotate(90deg); }
.cal-nav { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.cal-nav > button { background:var(--field-bg); border:1px solid var(--panel-border); color:var(--text-sub); padding:6px 16px; border-radius:8px; cursor:pointer; font-size:1rem; transition:.2s; }
.cal-nav > button:hover { background:#0e7490; color:#fff; }
.cal-nav .ym { font-size:1.15rem; font-weight:700; letter-spacing:.05em; }
.cal-today-btn { font-size:.7rem; padding:4px 14px; border-radius:999px; border:1px solid var(--accent); color:var(--accent); background:var(--accent-soft); cursor:pointer; transition:.2s; }
.cal-today-btn:hover { background:var(--accent); color:#fff; }
.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:5px; text-align:center; margin-top:10px; }
.cal-grid .header { font-weight:600; color:var(--text-sub); font-size:.78rem; padding:4px 0; }
.cal-grid .header.wknd { color:#fb7185; }
.cal-day { padding:7px 2px 5px; border-radius:10px; cursor:pointer; transition:.15s; border:1px solid transparent; position:relative; }
.cal-day:hover { background:var(--day-hover); border-color:var(--panel-border); }
.cal-day .solar { display:block; font-size:.95rem; font-weight:600; color:var(--text-main); line-height:1.2; }
.cal-day .lunar { display:block; font-size:.62rem; color:var(--text-dim); margin-top:1px; }
.cal-day.wknd .solar { color:#fb7185; }
.cal-day.other { opacity:.32; }
.cal-day.holiday .lunar { color:#fbbf24; font-weight:700; }
.cal-day.holiday::after { content:''; position:absolute; top:5px; right:6px; width:5px; height:5px; border-radius:50%; background:#fbbf24; box-shadow:0 0 6px #fbbf24; }
.cal-day.today { background:linear-gradient(180deg,#06b6d4,#0284c7); border-color:rgba(165,243,252,.7); box-shadow:0 0 14px rgba(34,211,238,.5); }
.cal-day.today .solar,.cal-day.today .lunar { color:#fff; }
.cal-day.today.holiday .lunar { color:#fef3c7; }
.cal-day.selected { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent),0 0 12px var(--accent-soft); }
.cal-detail { margin-top:14px; padding:12px 16px; background:var(--field-bg); border:1px solid var(--panel-border); border-radius:10px; font-size:.8rem; color:var(--text-sub); display:flex; flex-wrap:wrap; gap:8px 18px; align-items:center; }
.cal-detail b { color:var(--text-main); }
.cal-detail .d-holiday { color:#fbbf24; font-weight:700; background:rgba(251,191,36,.12); border:1px solid rgba(251,191,36,.4); padding:2px 10px; border-radius:999px; }
.cal-detail .d-lunar { color:#5eead4; }
.cal-legend { display:flex; gap:18px; justify-content:center; margin-top:12px; font-size:.7rem; color:var(--text-dim); }
.legend-dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:4px; vertical-align:middle; }
.legend-today { background:linear-gradient(180deg,#06b6d4,#0284c7); }
.legend-holiday { background:#fbbf24; box-shadow:0 0 5px #fbbf24; }
.legend-weekend { background:#fb7185; }
/* ===== 桌宠 ===== */
#petContainer { position:fixed; bottom:20px; right:20px; z-index:9999; width:120px; height:140px; cursor:grab; user-select:none; transition:none; touch-action:none; }
#petContainer:active { cursor:grabbing; }
#petContainer.collapsed { right:0; width:56px; height:56px; opacity:.92; background:var(--panel); border-radius:30px; backdrop-filter:blur(4px); border:1px solid var(--panel-border); display:flex; align-items:center; justify-content:center; }
#petContainer.collapsed .pet-emoji { display:none; }
#petContainer.collapsed .pet-bubble,#petContainer.collapsed .pet-controls,#petContainer.collapsed .pet-chat-input { display:none; }
#petContainer .expand-btn { display:none; font-size:1.4rem; color:var(--text-sub); background:none; border:none; cursor:pointer; line-height:1; }
#petContainer.collapsed .expand-btn { display:block; }
#petContainer .pet-bubble { position:absolute; bottom:100%; left:50%; transform:translateX(-50%); background:var(--panel-solid); border:1px solid var(--panel-border); border-radius:20px; padding:8px 14px; color:var(--text-main); font-size:.75rem; max-width:170px; white-space:nowrap; box-shadow:0 8px 20px rgba(0,0,0,.5); display:none; pointer-events:none; }
#petContainer .pet-bubble.show { display:block; }
#petContainer .pet-emoji { font-size:4.2rem; line-height:1; text-align:center; transition:transform .2s; filter:drop-shadow(0 8px 12px rgba(0,0,0,.45)); pointer-events:none; }
#petContainer .pet-emoji:hover { transform:scale(1.1); }
#petContainer .pet-controls { position:absolute; top:-10px; right:-10px; display:flex; gap:4px; }
#petContainer .pet-controls button { background:var(--panel-solid); border:1px solid var(--panel-border); border-radius:30px; color:var(--text-sub); width:24px; height:24px; font-size:.7rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.15s; }
#petContainer .pet-controls button:hover { background:#0e7490; color:#fff; }
.pet-chat-input { position:absolute; bottom:-48px; left:50%; transform:translateX(-50%); display:none; gap:4px; background:var(--panel-solid); padding:4px 8px; border-radius:40px; border:1px solid var(--panel-border); align-items:center; width:180px; }
.pet-chat-input input { background:transparent; border:none; color:var(--text-main); font-size:.75rem; padding:4px 6px; width:100%; outline:none; }
.pet-chat-input input::placeholder { color:var(--text-dim); }
.pet-chat-input button { background:#0891b2; border:none; color:#fff; border-radius:30px; padding:2px 10px; font-size:.7rem; cursor:pointer; }
.pet-chat-input.active { display:flex; }
/* ===== LOGO/图标动效 ===== */
@keyframes octopusFloat { 0%,100%{transform:translateY(0) rotate(0);} 50%{transform:translateY(-4px) rotate(3deg);} }
@keyframes tentaclePulse { 0%,100%{transform:scale(1);filter:drop-shadow(0 0 6px rgba(99,102,241,.5));} 50%{transform:scale(1.05);filter:drop-shadow(0 0 18px rgba(168,85,247,.7));} }
.octopus-logo-anim { animation:octopusFloat 3.2s ease-in-out infinite; }
.octopus-glow { animation:tentaclePulse 2.8s ease-in-out infinite; }
.icon-anim-hover { display:inline-block; transition:transform .3s cubic-bezier(.34,1.56,.64,1); }
.group:hover .icon-anim-hover,button:hover .icon-anim-hover { transform:scale(1.25) rotate(8deg); }
.icon-spin-hover { display:inline-block; transition:transform .5s ease; }
.group:hover .icon-spin-hover,button:hover .icon-spin-hover { transform:rotate(360deg); }
.category-menu-collapsed .category-item { display:none; }
@media (prefers-reduced-motion:reduce){ *,::before,::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }
/* ===== 头部双行布局：搜索引擎固定独占一行，其余组件自动补位 ===== */
.header-topline { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; }
.header-searchline { width:100%; flex:none; }
.header-searchline .search-input { font-size:.95rem; padding:.55rem .75rem; }
.header-searchline .engine-select { font-size:.8rem; padding:.55rem .7rem; }

/* 天气弹层（配合头部重建） */
.weather-pop { position:absolute; right:0; top:calc(100% + 10px); background:var(--panel-solid); border:1px solid var(--panel-border); box-shadow:0 18px 40px rgba(0,0,0,.5),0 0 24px var(--accent-soft); animation:modalIn .2s ease; }