/* ==========================================================================
   主题 / 壁纸 / 动效
   ========================================================================== */
[data-theme="obsidian"] { --bg:#06070b; --bg-2:#0b0d14; --accent:#4de2c2; --accent-2:#5a8cff; --accent-ink:#04140f;
  --panel:rgba(18,21,32,.72); --panel-2:rgba(28,32,48,.62); --panel-solid:#121520; }
[data-theme="cyberpunk"] { --bg:#0a0416; --bg-2:#150728; --accent:#ff2fb9; --accent-2:#22e0ff; --accent-ink:#1a0020;
  --panel:rgba(34,14,56,.72); --panel-2:rgba(50,20,80,.6); --panel-solid:#1b0b2e;
  --text:#f6ecff; --text-dim:#b79ad6; --text-faint:#7d629e;
  --border:rgba(255,70,200,.18); --border-strong:rgba(255,70,200,.36); --ok:#3cf0c0; --warn:#ffcc33; --bad:#ff4d6d; }
[data-theme="vaporwave"] { --bg:#120a24; --bg-2:#1d1038; --accent:#ff77e1; --accent-2:#7b6bff; --accent-ink:#210a2c;
  --panel:rgba(44,28,80,.7); --panel-2:rgba(60,38,104,.58); --panel-solid:#241747;
  --text:#f3ecff; --text-dim:#b3a3d8; --text-faint:#7f6ea8;
  --border:rgba(255,150,235,.18); --border-strong:rgba(255,150,235,.34); }
[data-theme="matrix"] { --bg:#020603; --bg-2:#04120a; --accent:#33ff88; --accent-2:#00c2a8; --accent-ink:#001a0c;
  --panel:rgba(6,22,13,.74); --panel-2:rgba(10,34,20,.6); --panel-solid:#07180e;
  --text:#dcffe9; --text-dim:#79b894; --text-faint:#4a7a5d;
  --border:rgba(51,255,136,.16); --border-strong:rgba(51,255,136,.34); }
[data-theme="sakura"] { --bg:#160d13; --bg-2:#22131c; --accent:#ff9ec4; --accent-2:#ffd48a; --accent-ink:#2a0d18;
  --panel:rgba(48,28,38,.72); --panel-2:rgba(66,38,52,.6); --panel-solid:#2a1720;
  --text:#fff0f6; --text-dim:#d3aebd; --text-faint:#9c7788;
  --border:rgba(255,158,196,.18); --border-strong:rgba(255,158,196,.36); }
[data-theme="arctic"] { --bg:#070d14; --bg-2:#0c1622; --accent:#7fd8ff; --accent-2:#a0ffe0; --accent-ink:#04141f;
  --panel:rgba(16,30,44,.72); --panel-2:rgba(24,44,62,.6); --panel-solid:#0f1e2c;
  --text:#e8f6ff; --text-dim:#94b6cc; --text-faint:#5f7f96;
  --border:rgba(127,216,255,.18); --border-strong:rgba(127,216,255,.36); }
[data-theme="vinyl"] { --bg:#12100c; --bg-2:#1c1812; --accent:#e8b45a; --accent-2:#c9713c; --accent-ink:#231705;
  --panel:rgba(38,32,24,.76); --panel-2:rgba(54,45,33,.62); --panel-solid:#221d15;
  --text:#f8f0e2; --text-dim:#c0ad90; --text-faint:#8a7a62;
  --border:rgba(232,180,90,.18); --border-strong:rgba(232,180,90,.34); }
[data-theme="sunset"] { --bg:#140a08; --bg-2:#241009; --accent:#ff8a4c; --accent-2:#ff4d8d; --accent-ink:#2a0f04;
  --panel:rgba(46,24,16,.72); --panel-2:rgba(64,32,20,.6); --panel-solid:#2a1610;
  --text:#ffeee4; --text-dim:#d3a893; --text-faint:#9a7460;
  --border:rgba(255,138,76,.18); --border-strong:rgba(255,138,76,.36); }
[data-theme="light-lab"] { --bg:#eef1f7; --bg-2:#e2e7f1; --accent:#0f9d8a; --accent-2:#2f6bff; --accent-ink:#ffffff;
  --panel:rgba(255,255,255,.82); --panel-2:rgba(255,255,255,.7); --panel-solid:#ffffff;
  --text:#111826; --text-dim:#4d586e; --text-faint:#818da3;
  --border:rgba(10,20,40,.12); --border-strong:rgba(10,20,40,.24); --grid-line:rgba(10,20,40,.06);
  --shadow-1:0 2px 12px rgba(20,30,60,.1); --shadow-2:0 18px 48px rgba(20,30,60,.18); }
[data-theme="light-lab"] .topbar { background: rgba(255,255,255,.78); }

body[data-wall="aurora"] #bgScrim, body[data-wall="particles"] #bgScrim,
body[data-wall="grid"] #bgScrim, body[data-wall="wave"] #bgScrim { background: linear-gradient(180deg, rgba(0,0,0,.32), rgba(0,0,0,.6)); }
body[data-theme="light-lab"][data-wall="aurora"] #bgScrim, body[data-theme="light-lab"][data-wall="particles"] #bgScrim,
body[data-theme="light-lab"][data-wall="grid"] #bgScrim { background: linear-gradient(180deg, rgba(255,255,255,.4), rgba(255,255,255,.66)); }

body[data-anim="0"] *, body[data-anim="0"] *::before, body[data-anim="0"] *::after {
  animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; }
body[data-anim="1"] .vcard:hover { transform: translateY(-1px); }
body[data-anim="1"] .stat:hover { transform: none; }
body[data-anim="2"] .panel { transition: border-color var(--dur) var(--ease); }
body[data-anim="2"] .panel:hover { border-color: color-mix(in srgb, var(--accent) 26%, var(--border)); }
body[data-anim="2"] .brand .logo::after { content:''; position:absolute; inset:-40%;
  background: conic-gradient(from 0deg, transparent 0 60%, rgba(255,255,255,.55) 72%, transparent 82%);
  animation: sweep 3.6s linear infinite; }
@keyframes sweep { to { transform: rotate(360deg); } }
body[data-anim="2"] .tabs button.on { animation: tabPulse 2.6s var(--ease) infinite; }
@keyframes tabPulse { 0%,100% { box-shadow: 0 6px 18px color-mix(in srgb, var(--accent) 30%, transparent); }
  50% { box-shadow: 0 6px 30px color-mix(in srgb, var(--accent) 58%, transparent); } }
body[data-anim="2"] .dropzone.over .dz-icon { animation: bob .9s var(--ease) infinite alternate; }
@keyframes bob { to { transform: translateY(-6px); } }

body[data-scan="1"] .panel::after { content:''; position:absolute; left:0; right:0; height:1px; pointer-events:none;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 70%, transparent), transparent);
  opacity:.35; animation: scan 5.2s linear infinite; }
@keyframes scan { 0% { top: 0; opacity: 0; } 12% { opacity: .4; } 88% { opacity: .4; } 100% { top: 100%; opacity: 0; } }

@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }
.pulsing { animation: pulse 1.3s var(--ease) infinite; }
.skeleton { background: linear-gradient(90deg, rgba(255,255,255,.05) 25%, rgba(255,255,255,.12) 37%, rgba(255,255,255,.05) 63%);
  background-size: 400% 100%; animation: shimmer 1.4s linear infinite; border-radius: 6px; }
@keyframes shimmer { from { background-position: 100% 0; } to { background-position: 0 0; } }

.theme-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.theme-swatch { border: 1.5px solid var(--border); border-radius: 12px; padding: 9px; cursor: pointer;
  background: rgba(0,0,0,.24); transition: all var(--dur) var(--ease); text-align: center; }
.theme-swatch:hover { transform: translateY(-2px); border-color: var(--border-strong); }
.theme-swatch.on { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent); }
.theme-swatch .prev { height: 34px; border-radius: 8px; display: flex; overflow: hidden; margin-bottom: 7px; }
.theme-swatch .prev i { flex: 1; }
.theme-swatch .nm { font-size: 11px; color: var(--text-dim); }
.theme-swatch.on .nm { color: var(--text); }
.wall-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.wall-opt { border: 1.5px solid var(--border); border-radius: 11px; padding: 12px 6px; cursor: pointer;
  text-align: center; font-size: 11px; color: var(--text-dim); background: rgba(0,0,0,.24); transition: all var(--dur) var(--ease); }
.wall-opt:hover { border-color: var(--border-strong); color: var(--text); }
.wall-opt.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }

@media (prefers-reduced-motion: reduce) {
  body[data-anim] *, body[data-anim] *::before, body[data-anim] *::after {
    animation-duration: .001s !important; transition-duration: .001s !important; } }