/* 主题封面：全屏覆盖实验台；布局按 16:9 课堂屏设计，普通桌面窗口自适应。动画仅用 transform/opacity/背景位移。 */
#cover { --card: #0a1a2e; position: fixed; inset: 0; z-index: 100; display: grid; grid-template-columns: minmax(400px, 0.78fr) 1.45fr; align-items: center; gap: 1vw; padding: 0 3vw 0 5.5vw; overflow: hidden; color: #e6f1ff; background: radial-gradient(120% 90% at 70% 40%, #0d2340 0%, #060b14 62%); transition: opacity .7s ease, transform .7s ease; }
#cover.leaving { opacity: 0; transform: scale(1.06); pointer-events: none; }
html.cover-on #physics-classroom-toolbar { opacity: .85; }

/* 背景：彩色光晕缓慢漂移、透视网格地面向前流动、电荷光点上升 */
.cv-bg { position: absolute; inset: 0; pointer-events: none; }
.cv-blob { position: absolute; width: 58vmax; height: 58vmax; border-radius: 50%; opacity: .55; animation: cvDrift 18s ease-in-out infinite alternate; }
.cv-blob.a { left: -18vmax; top: -22vmax; background: radial-gradient(circle, rgba(62, 224, 255, .5), transparent 62%); }
.cv-blob.b { right: -20vmax; top: -10vmax; background: radial-gradient(circle, rgba(176, 107, 255, .45), transparent 62%); animation-duration: 22s; animation-delay: -6s; }
.cv-blob.c { left: 25vw; bottom: -30vmax; background: radial-gradient(circle, rgba(255, 95, 168, .35), transparent 60%); animation-duration: 26s; animation-delay: -12s; }
@keyframes cvDrift { 0% { transform: translate(0, 0) scale(1); } 50% { transform: translate(6vmax, 4vmax) scale(1.12); } 100% { transform: translate(-4vmax, 7vmax) scale(.95); } }
.cv-floor { position: absolute; left: -40%; right: -40%; bottom: -6%; height: 52%; transform: perspective(520px) rotateX(64deg); transform-origin: 50% 0; background-image: linear-gradient(rgba(62, 224, 255, .26) 1.5px, transparent 1.5px), linear-gradient(90deg, rgba(62, 224, 255, .2) 1.5px, transparent 1.5px); background-size: 64px 64px; animation: cvFloor 2.6s linear infinite; -webkit-mask-image: linear-gradient(to top, #000 25%, transparent 95%); mask-image: linear-gradient(to top, #000 25%, transparent 95%); }
@keyframes cvFloor { to { background-position: 0 64px, 0 0; } }
.cv-sparks i { position: absolute; bottom: -12px; width: var(--s); height: var(--s); border-radius: 50%; background: var(--c); box-shadow: 0 0 10px var(--c), 0 0 22px var(--c); opacity: 0; animation: cvRise var(--d) linear var(--delay) infinite; }
@keyframes cvRise { 0% { transform: translate(0, 0); opacity: 0; } 12% { opacity: .9; } 80% { opacity: .6; } 100% { transform: translate(4vw, -105vh); opacity: 0; } }

/* 文案 */
.cv-copy { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 18px; animation: cvIn .9s ease both; }
.cv-copy small { font-size: clamp(14px, 1.15vw, 18px); color: #8fd8ff; letter-spacing: .18em; }
.cv-copy h1 { margin: 0; font-size: clamp(64px, 7.6vw, 136px); line-height: 1.02; font-weight: 800; letter-spacing: .04em; display: flex; flex-wrap: wrap; }
.cv-copy h1 span { background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: cvShine 6s linear infinite; }
.cv-t1 { background-image: linear-gradient(100deg, #6ff3ff 0%, #3ec2ff 25%, #ffffff 50%, #3ec2ff 75%, #6ff3ff 100%); filter: drop-shadow(0 0 22px rgba(62, 224, 255, .55)); }
.cv-t2 { background-image: linear-gradient(100deg, #ffd27a 0%, #ff6fb5 30%, #fff1c9 50%, #ff6fb5 70%, #ffd27a 100%); filter: drop-shadow(0 0 22px rgba(255, 111, 181, .45)); }
@keyframes cvShine { to { background-position: 200% 0; } } /* 背景宽 200%，位移 200% 恰为一个完整周期，首尾同色可无缝循环 */
.cv-copy p { margin: 0; font-size: clamp(18px, 1.6vw, 26px); color: #cfe2f5; letter-spacing: .08em; }
.cv-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 4px; padding: 0; list-style: none; max-width: 560px; }
.cv-chips li.more { background: none; border-style: dashed; color: #9fc4e0; }
.cv-chips li { padding: 7px 14px; border-radius: 999px; font-size: clamp(14px, 1.05vw, 17px); color: #dff6ff; background: rgba(62, 224, 255, .1); border: 1px solid rgba(62, 224, 255, .35); animation: cvIn .7s ease both; }
.cv-chips li:nth-child(4n+2) { background: rgba(255, 179, 71, .12); border-color: rgba(255, 179, 71, .45); }
.cv-chips li:nth-child(4n+3) { background: rgba(176, 107, 255, .14); border-color: rgba(176, 107, 255, .5); }
.cv-chips li:nth-child(4n) { background: rgba(69, 240, 160, .1); border-color: rgba(69, 240, 160, .45); }
.cv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 10px; }
.cv-enter { position: relative; display: inline-flex; align-items: center; gap: 14px; padding: 18px 38px; border: 0; border-radius: 999px; font-size: clamp(22px, 1.9vw, 30px); font-weight: 700; letter-spacing: .1em; color: #04121c; background: linear-gradient(135deg, #6ff3ff, #3ec2ff 55%, #8f7bff); box-shadow: 0 0 26px rgba(62, 224, 255, .65), 0 10px 30px rgba(0, 0, 0, .4); transition: transform .2s; }
.cv-enter span { transition: transform .2s; }
.cv-enter:hover { transform: translateY(-2px) scale(1.03); } .cv-enter:hover span { transform: translateX(6px); }
.cv-enter::after { content: ''; position: absolute; inset: -6px; border-radius: inherit; border: 2px solid rgba(111, 243, 255, .7); animation: cvRing 2s ease-out infinite; pointer-events: none; }
@keyframes cvRing { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(1.22, 1.5); opacity: 0; } }
.cv-music { padding: 14px 22px; border-radius: 999px; font-size: clamp(16px, 1.25vw, 20px); color: #ffd6f0; background: rgba(255, 95, 168, .12); border: 1px solid rgba(255, 95, 168, .55); box-shadow: 0 0 16px rgba(255, 95, 168, .25); }
.cv-music:hover { background: rgba(255, 95, 168, .22); }
.cv-copy em { font-style: normal; font-size: 14px; color: #7f97b0; letter-spacing: .1em; }
@keyframes cvIn { from { opacity: 0; transform: translateY(18px); } }

/* 电路演示 */
.cv-stage { position: relative; z-index: 1; transition: transform .25s ease-out; animation: cvFloat 7s ease-in-out infinite; }
@keyframes cvFloat { 50% { translate: 0 -10px; } }
.cv-circuit { display: block; width: 100%; max-height: 92vh; overflow: visible; }
.cv-card { fill: var(--card); stroke: rgba(62, 224, 255, .35); stroke-width: 1.5; filter: drop-shadow(0 0 30px rgba(62, 224, 255, .18)); }
.cv-wire { fill: none; stroke: #2f6f9a; stroke-width: 5; stroke-linejoin: round; }
.cv-flow { fill: none; stroke: #ffc15a; stroke-width: 7; stroke-linecap: round; stroke-dasharray: 0.1 25; opacity: 0; transition: opacity .6s; animation: cvFlow 1.1s linear infinite; }
.cv-circuit.on .cv-flow { opacity: 1; }
@keyframes cvFlow { to { stroke-dashoffset: -25; } }
.cv-cut { fill: var(--card); }
.cv-sym { fill: none; stroke: #cfe8ff; stroke-width: 3.5; stroke-linecap: round; }
.cv-sym.thick { stroke-width: 9; }
.cv-node { fill: #cfe8ff; }
.cv-blade { transition: stroke .3s; }
.cv-circuit.closed .cv-blade { stroke: #6ff3ff; }
.cv-pol { fill: #ffb347; font: 700 22px "Microsoft YaHei", sans-serif; text-anchor: middle; }
.cv-pol.sm { font-size: 18px; }
.cv-tag { fill: #8fb3d0; font: 700 18px "Microsoft YaHei", sans-serif; text-anchor: middle; }
.cv-a { fill: #cfe8ff; font: 700 22px "Microsoft YaHei", sans-serif; text-anchor: middle; transition: fill .4s; }
.cv-caption { fill: #9fc4e0; font: 18px "Microsoft YaHei", sans-serif; text-anchor: middle; letter-spacing: .05em; opacity: 0; transition: opacity .8s .4s; }
.cv-circuit.on .cv-caption { opacity: 1; }
.cv-halo { opacity: 0; transition: opacity .5s; transform-box: fill-box; transform-origin: center; }
.cv-circuit.on .cv-halo { opacity: 1; animation: cvGlow 2.2s ease-in-out infinite; }
@keyframes cvGlow { 50% { transform: scale(1.08); opacity: .85; } }
.cv-circuit.on .cv-bulb { stroke: #ffd27a; }
.cv-circuit.on .cv-fil { stroke: #fff6cf; filter: drop-shadow(0 0 6px #ffcf5a); }
.cv-circuit.on .cv-ring { stroke: #6ff3ff; filter: drop-shadow(0 0 8px #3ee0ff); }
.cv-circuit.on .cv-a { fill: #6ff3ff; }

@media (max-width: 900px) { #cover { grid-template-columns: 1fr; padding: 6vh 6vw; align-content: center; } .cv-stage { display: none; } }
@media (prefers-reduced-motion: reduce) { #cover *, #cover *::after { animation: none !important; } .cv-circuit .cv-flow { stroke-dasharray: none; opacity: .7; } }