14 lines
1.7 KiB
CSS
14 lines
1.7 KiB
CSS
/* 宇森剧情漫画播放器 —— 全屏遮罩样式 */
|
|
#introOverlay{position:fixed;inset:0;z-index:6000;background:#05070d;display:none;align-items:center;justify-content:center;flex-direction:column;opacity:0;transition:opacity .5s ease;user-select:none;}
|
|
#introOverlay.active{display:flex;opacity:1;}
|
|
#introOverlay .introImg{max-width:92vw;max-height:78vh;border-radius:12px;box-shadow:0 20px 70px rgba(0,0,0,.7);opacity:0;transform:scale(.98);transition:opacity .45s ease,transform .45s ease;pointer-events:none;}
|
|
#introOverlay .introImg.show{opacity:1;transform:scale(1);}
|
|
#introOverlay .introDots{display:flex;gap:10px;margin-top:22px;}
|
|
#introOverlay .introDot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.25);transition:background .3s,transform .3s;}
|
|
#introOverlay .introDot.on{background:#4af;transform:scale(1.25);}
|
|
#introOverlay .introHint{position:absolute;bottom:26px;left:0;right:0;text-align:center;color:#9fb0c0;font-size:13px;letter-spacing:.5px;transition:opacity .3s;}
|
|
#introOverlay .introSkip{position:absolute;top:18px;right:20px;padding:7px 16px;border-radius:20px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#cdd8e6;font-size:13px;cursor:pointer;transition:background .2s;}
|
|
#introOverlay .introSkip:hover{background:rgba(255,255,255,.18);}
|
|
#introOverlay .introEnter{margin-top:26px;padding:12px 38px;border:none;border-radius:26px;background:linear-gradient(135deg,#8b5cf6,#4aafff);color:#fff;font-size:15px;font-weight:600;cursor:pointer;box-shadow:0 8px 24px rgba(74,175,255,.4);opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .4s,transform .4s;}
|
|
#introOverlay .introEnter.show{opacity:1;transform:translateY(0);pointer-events:auto;}
|