/* ============ 门户首页：暗色液态玻璃 + 动态视频 ============ */ /* 仅作用于，不影响管理端/用户端的蓝白主题 */ /* 暗色玻璃变量 */ body.theme-portal{ --accent:#6ea8fe; --accent-strong:#3b82f6; --accent-soft:rgba(110,168,254,.16); --accent-text:#cfe0ff; --text:#eef2f7; --muted:#9aa6b8; --glass-bg:rgba(255,255,255,.07); --glass-bg-2:rgba(255,255,255,.12); --glass-border:rgba(255,255,255,.16); --glass-border-strong:rgba(255,255,255,.30); color:var(--text); background:#0a0f1f; background-image: radial-gradient(42% 52% at 12% 18%, rgba(59,130,246,.40), transparent 60%), radial-gradient(46% 56% at 88% 14%, rgba(34,211,238,.30), transparent 60%), radial-gradient(52% 62% at 78% 86%, rgba(139,92,246,.34), transparent 60%), radial-gradient(46% 52% at 18% 92%, rgba(16,185,129,.22), transparent 60%); background-attachment:fixed; min-height:100vh; position:relative; } /* 缓慢漂浮的光晕，给玻璃提供可模糊的动态底色 */ body.theme-portal::before{ content:"";position:fixed;inset:-25%;z-index:-2;pointer-events:none; background: radial-gradient(28% 28% at 30% 32%, rgba(59,130,246,.50), transparent 62%), radial-gradient(30% 30% at 72% 58%, rgba(34,211,238,.40), transparent 62%), radial-gradient(24% 24% at 52% 82%, rgba(139,92,246,.40), transparent 62%); filter:blur(46px); animation:floatBg 20s ease-in-out infinite alternate; } @keyframes floatBg{ from{transform:translate3d(-2%,-1%,0) scale(1);} to{transform:translate3d(3%,2%,0) scale(1.08);} } /* 门户布局 */ .portal{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;z-index:1;} .portal-card{max-width:560px;width:100%;text-align:center;padding:52px 44px;} /* 玻璃卡片（半实底，确保文字在清晰视频背景上仍可读） */ body.theme-portal .card{ background:rgba(13,19,38,.86); backdrop-filter:blur(18px) saturate(140%); -webkit-backdrop-filter:blur(18px) saturate(140%); border:1px solid var(--glass-border); box-shadow:0 20px 50px rgba(0,0,0,.50), inset 0 1px 0 rgba(255,255,255,.16); } body.theme-portal .card::before{ content:"";position:absolute;inset:0;border-radius:inherit;padding:1.4px; background:linear-gradient(160deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.12) 22%, rgba(255,255,255,0) 45%, rgba(255,255,255,0) 60%, rgba(255,255,255,.18) 82%, rgba(255,255,255,.5) 100%); -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite:xor;mask-composite:exclude; pointer-events:none; } body.theme-portal .card > *{position:relative;z-index:1;} .eyebrow{font-family:var(--font-head);font-style:italic;letter-spacing:.02em;color:var(--accent-text);font-size:20px;margin-bottom:16px;text-shadow:0 2px 16px rgba(110,168,254,.35);} .portal-title{font-size:40px;font-weight:600;margin:0 0 18px;letter-spacing:.5px;text-shadow:0 2px 24px rgba(110,168,254,.28);} .portal-sub{color:var(--muted);font-size:15px;line-height:1.85;margin:0 auto 34px;max-width:460px;} .portal-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;} .portal-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 34px;border-radius:14px;font-size:15px;font-weight:600;text-decoration:none;transition:.18s;color:#fff;} .portal-btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent-strong));box-shadow:0 12px 32px rgba(59,130,246,.42);} .portal-btn.primary:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(59,130,246,.55);} .portal-btn:not(.primary){background:rgba(255,255,255,.07);border:1px solid var(--glass-border);color:var(--text);backdrop-filter:blur(8px);} .portal-btn:not(.primary):hover{background:rgba(255,255,255,.13);border-color:var(--glass-border-strong);transform:translateY(-2px);} .portal-btn svg{width:18px;height:18px;margin-right:9px;vertical-align:-3px;} .portal-foot{margin-top:30px;font-size:13px;color:var(--muted);letter-spacing:.02em;} /* 动态视频背景 */ .portal-bg{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3;opacity:.95;transform:scale(1.04);filter:saturate(130%) brightness(.92);pointer-events:none;transition:opacity .8s ease;} /* 视频加载中 / 播放失败时降低不透明度，渐变背景透出来 */ .portal-bg.loading{opacity:.15;} .portal-bg.failed{opacity:0;} .portal-veil{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 55% 50% at 50% 50%, rgba(6,10,22,.72) 0%, rgba(6,10,22,.42) 55%, transparent 100%);} @media (max-width:600px){ .portal-card{padding:40px 24px;} .portal-title{font-size:32px;} }