/* 90年代复古风格 CSS */

/* 全局样式：黑色星空背景，绿色等宽/衬线字体 */
body {
    font-family: "Times New Roman", Times, serif;
    background-image: url('data:image/svg+xml;utf8,<svg width="50" height="50" xmlns="http://www.w3.org/2000/svg"><rect width="50" height="50" fill="%23000"/><circle cx="10" cy="10" r="1" fill="%23FFF"/><circle cx="40" cy="30" r="1.5" fill="%23FFF"/><circle cx="20" cy="45" r="0.5" fill="%23FFF"/></svg>');
    background-color: black;
    color: #33CC33;
    margin: 0;
    padding: 20px;
}

/* 页面主体容器，限制宽度以模拟早期低分辨率显示器 */
.container {
    width: 800px;
    margin: 0 auto;
    border: 5px outset #808080;
    padding: 20px;
    background-color: rgba(0, 0, 0, 0.85);
}

/* 浮夸的文字阴影 */
h1, h2, h3 {
    text-shadow: 2px 2px #FF0000;
    color: #FFFF00;
}

/* 链接样式 */
a {
    color: #00FFFF;
    text-decoration: underline;
    font-weight: bold;
}
a:hover {
    color: #FF00FF;
    background-color: #000080;
}

/* 现代浏览器中模拟 <blink> 标签的闪烁效果 */
blink {
    animation: blinker 1s linear infinite;
}
@keyframes blinker {
    50% { opacity: 0; }
}

/* 3D 边框的留言板 */
.guestbook {
    border: 6px outset #C0C0C0;
    padding: 20px;
    background-color: #008080;
    color: white;
    width: 60%;
    text-align: center;
}

/* 灰色的表单控件，经典的 Windows 95/98 风格 */
input, textarea {
    background-color: #C0C0C0;
    color: black;
    border: 2px inset #FFFFFF;
    font-family: "Courier New", Courier, monospace;
    font-size: 14px;
}

/* 3D 凸起按钮 */
input[type="submit"], input[type="reset"] {
    background-color: #C0C0C0;
    border: 3px outset #FFFFFF;
    cursor: pointer;
    font-weight: bold;
    padding: 5px 15px;
    margin: 0 10px;
}

/* 按钮点击凹陷效果 */
input[type="submit"]:active, input[type="reset"]:active {
    border: 3px inset #FFFFFF;
}

/* 经典黑色底黄色数字的访客计数器 */
.counter {
    display: inline-block;
    border: 2px inset #808080;
    background-color: black;
    color: #33CC33;
    font-family: "Courier New", Courier, monospace;
    font-size: 20px;
    font-weight: bold;
    padding: 2px 5px;
    letter-spacing: 2px;
}
.counter span {
    border: 1px solid #333;
    padding: 0 3px;
    background-color: #111;
}

/* 音乐播放器复古样式 */
.music-player {
    border: 4px outset #C0C0C0;
    background-color: #C0C0C0;
    width: 350px;
    padding: 5px;
    color: black;
    font-family: "Courier New", Courier, monospace;
}

.player-title {
    background-color: #000080;
    color: white;
    font-weight: bold;
    padding: 3px 5px;
    text-align: left;
    font-size: 14px;
    letter-spacing: 1px;
}

.player-status {
    background-color: black;
    color: #33CC33;
    border: 2px inset #808080;
    padding: 4px;
    margin-top: 5px;
    font-size: 13px;
    text-align: center;
    font-weight: bold;
}
