/* responsive.css - 响应式、动画、工具类 */
/* 表格 & 内容 */
.pun table {
 width: 100%;
 border-collapse: collapse;
 border-spacing: 0;
}

.pun td, .pun th {
 padding: 4px 6px;
 text-align: left;
 background: #272726;
}

.pun .rowodd, .pun .roweven { background-color: #252524; }
.pun .roweven:hover, .pun .rowodd:hover { background-color: #20201f; }

/* 辅助类 */
.hidden { display: none!important; }
.fake-link { cursor: pointer; }
.full-width { width: 100%; }
.centered { text-align: center; margin: 0 auto; }

/* 动画 */
@-webkit-keyframes sk-bouncedelay {
 0%, 100%, 80% { transform: scale(0); }
 40% { transform: scale(1); }
}
@keyframes sk-bouncedelay {
 0%, 100%, 80% { transform: scale(0); }
 40% { transform: scale(1); }
}

/* ===================== 入场动画 ===================== */
#intro-overlay {
 --stay: 4s;        /* 停留时间（显示多久） */
 --fade: 1.0s;      /* 渐变消失速度 */
 
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background: #101010;
 z-index: 9999;
 display: flex;
 align-items: center;
 justify-content: center;
 flex-direction: column;
 font-family: 'Raleway', sans-serif;
 opacity: 1;
 animation: overlayHide var(--fade) ease var(--stay) forwards;
}

@keyframes overlayHide {
 to { opacity: 0; visibility: hidden; }
}

#intro-overlay .bar {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 3px;
 background: linear-gradient(to right, #1e5799 0%, #f300ff 50%, #e0ff00 100%);
 border-bottom: 1px solid #000;
}

#intro-overlay .logo {
 font-size: 62px;
 color: #eee;
 font-weight: 400;
 margin: 0;
}
#intro-overlay .logo span {
 color: #6cc312;
}

#intro-overlay .text {
 color: #ddd;
 font-size: 1.75em;
 margin-top: 10px;
}

#intro-overlay .loader {
 margin-top: 12px;
}
#intro-overlay .loader div {
 display: inline-block;
 width: 14px;
 height: 14px;
 border-radius: 50%;
 background: #eee;
 animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
#intro-overlay .loader .one { animation-delay: -0.32s; }
#intro-overlay .loader .two { animation-delay: -0.16s; }

/* 页面渐入 */
body {
 --body-fade: 0.8s;    /* 网页淡入速度 */
 
 opacity: 0;
 animation: bodyFade var(--body-fade) ease 1s forwards;
}
@keyframes bodyFade {
 to { opacity: 1; }
}

/* 响应式 */
@media only screen and (max-width: 800px) {
 .postmsg iframe { max-width:100%; height: auto; }
}

@media only screen and (max-width: 600px) {
 .pun .postfootright, .pun .postright { border-left-width:0; }
 .pun .postfootleft, .pun .postleft { display: none; }
 .pun .txtarea { width: 90%; }
 .pun .blockmenu { width: 100%; }
}