/* ============ 芸芸的星空小屋 · 1999 风格 ============ */
* { box-sizing: border-box; }
html { cursor: crosshair; }
body {
  margin: 0; padding: 0;
  background: #02020e url(star_tile.gif) repeat;
  color: #c9c9e8;
  font-family: "SimSun", "宋体", serif;
  font-size: 14px;
  line-height: 1.7;
}
a { color: #7f7fff; text-decoration: underline; }
a:visited { color: #c080ff; }
a:hover { color: #ffff80; background: #000040; }

/* 顶部闪烁星（规则一） */
#corner-star {
  position: fixed; top: 6px; left: 6px; width: 36px; height: 36px;
  z-index: 9000; cursor: pointer;
}

/* 主容器：经典居中表格 */
.wrap { width: 760px; margin: 18px auto 60px; }
.banner {
  text-align: center; padding: 26px 10px 18px;
  border: 3px ridge #5a5aa0;
  background: rgba(6,6,30,.88);
}
.banner h1 {
  margin: 0; font-size: 34px; letter-spacing: 6px;
  color: #e8e8ff;
  text-shadow: 0 0 8px #8080ff, 2px 2px 0 #200030;
  font-family: "SimHei", "黑体", serif;
}
.banner .sub { color: #8888cc; font-size: 12px; margin-top: 6px; }
marquee { color: #ffd24a; font-weight: bold; }

table.nav {
  width: 100%; border-collapse: collapse; margin: 8px 0;
  background: #0a0a2a;
}
table.nav td {
  border: 2px inset #4a4a90; text-align: center; padding: 5px 2px;
  font-size: 13px;
}
table.nav td.here { background: #1c1c50; color: #ffff80; font-weight: bold; }

.panel {
  border: 3px ridge #5a5aa0;
  background: rgba(8,8,26,.92);
  padding: 16px 20px; margin: 10px 0;
}
.panel h2 {
  font-size: 18px; color: #ffd24a; margin: 4px 0 12px;
  border-bottom: 1px dashed #444488; padding-bottom: 6px;
}
.panel img.photo {
  border: 4px ridge #6a6aa0; background:#111; display:block;
}
.footer {
  text-align: center; font-size: 12px; color: #7777aa;
  border-top: 1px dashed #444488; margin-top: 14px; padding-top: 10px;
}
.counter {
  font-family: "Courier New", monospace; font-weight: bold;
  background: #000; color: #7dff7d; padding: 2px 8px;
  border: 2px inset #333; letter-spacing: 3px;
}
.counter.red { color: #ff4040; text-shadow: 0 0 6px #ff0000; }

hr.divider { border: none; height: 10px; background: url(divider.gif) repeat-x; margin: 14px 0; }

/* 守则列表 */
ol.rules { margin: 0; padding-left: 26px; }
ol.rules li { margin: 10px 0; cursor: default; }
ol.rules li.struck { text-decoration: line-through; color: #666; }
.hidden-ink { color: #08081a; } /* 白底黑字的反向：藏字 */
.hidden-ink::selection { color: #ff2020; }

/* 日记 */
.diary-entry { border: 1px dashed #3a3a70; margin: 12px 0; padding: 10px 14px; background: rgba(12,12,36,.7); }
.diary-entry .date { color: #7fc8ff; font-weight: bold; }
.diary-entry.torn { transform: rotate(-.4deg); filter: brightness(.92); }

/* 留言板 */
.gb { border: 2px inset #4a4a90; background: #06061a; padding: 8px 14px; margin: 10px 0; }
.gb .meta { color: #8f8fd0; font-size: 12px; }
.gb .name { color: #7dff9d; font-weight: bold; }
.gb .name.yunyun { color: #ff9dd6; }
.gb p { margin: 6px 0 2px; }

/* 相册 */
.photos td { padding: 10px; text-align: center; vertical-align: top; font-size: 12px; }
.broken {
  width: 132px; height: 150px; border: 2px dashed #555; display: inline-block;
  background: #0a0a16; color: #666; line-height: 150px; cursor: pointer;
}
.broken:hover { color: #aa3030; border-color: #aa3030; }
#photo3-img { filter: brightness(.32) contrast(1.3); transition: filter 1.2s; cursor: pointer; }
#photo3-img.revealed { filter: brightness(2.4) contrast(1.6) saturate(2); }

/* 假源代码窗口 */
#src-modal, #note-modal {
  display: none; position: fixed; inset: 0; z-index: 9500;
  background: rgba(0,0,0,.75);
}
.src-win {
  width: 720px; max-height: 80vh; margin: 6vh auto; background: #c0c0c0;
  border: 3px outset #dfdfdf; color: #000; font-family: "Courier New", monospace;
}
.src-win .bar {
  background: #000080; color: #fff; padding: 3px 8px; font-weight: bold;
  font-family: "SimSun", serif; display: flex; justify-content: space-between;
}
.src-win .bar span.x { cursor: pointer; padding: 0 6px; background:#c0c0c0; color:#000; border:2px outset #fff; }
.src-win pre {
  margin: 0; padding: 12px; font-size: 12px; white-space: pre-wrap;
  max-height: 66vh; overflow: auto; background: #fff;
}
.src-win .cmt { color: #a00000; background: #ffe8e8; font-weight: bold; }

/* 记事本 */
#note-btn {
  position: fixed; right: 14px; bottom: 14px; z-index: 9400;
  background: #c0c0c0; color: #000; border: 3px outset #dfdfdf;
  padding: 6px 12px; font-family: "SimSun", serif; font-size: 13px; cursor: pointer;
}
#note-btn .dot { color: #c00000; font-weight: bold; }
.note-win { width: 560px; max-height: 76vh; margin: 9vh auto; background: #c0c0c0; border: 3px outset #dfdfdf; color:#000; }
.note-win .body { background: #ffffd8; margin: 8px; padding: 12px; max-height: 60vh; overflow: auto; font-size: 13px; }
.note-win .clue { border-bottom: 1px dotted #999; padding: 6px 2px; }
.note-win .clue b { color: #800000; }

/* 按钮 & 输入 */
button, .btn98 {
  background: #c0c0c0; border: 3px outset #dfdfdf; color: #000;
  font-family: "SimSun", serif; font-size: 14px; padding: 4px 18px; cursor: pointer;
}
button:active, .btn98:active { border-style: inset; }
input[type=text], input[type=password] {
  background: #fff; color: #000; border: 2px inset #888;
  font-family: "Courier New", monospace; font-size: 15px; padding: 4px 8px;
}

/* 里页面 */
body.inner {
  background: #000;
  color: #b00000;
  font-family: "SimSun", serif;
}
body.inner .wrap { width: 680px; }
#truth { font-size: 16px; line-height: 2.1; min-height: 420px; white-space: pre-wrap; }
#truth .w { color: #d8d8d8; }
#truth .r { color: #ff2020; text-shadow: 0 0 8px #900; }
.blink { animation: blink 1s steps(2) infinite; }
@keyframes blink { 50% { opacity: 0; } }

/* 跳吓层 */
#scare-layer {
  display: none; position: fixed; inset: 0; z-index: 9999; background: #000;
  justify-content: center; align-items: center;
}
#scare-layer img { max-width: 92vw; max-height: 92vh; image-rendering: pixelated; }
#static-layer {
  display: none; position: fixed; inset: 0; z-index: 9998; pointer-events: none;
  background: url(static.gif) repeat; opacity: .55;
}

/* 通关后的闹鬼态 */
body.haunted .banner h1 { color: #ffb0b0; text-shadow: 0 0 10px #f00; }
body.haunted .panel { border-color: #703030; }
.glitch-flash { animation: gflash .28s steps(3) 1; }
@keyframes gflash { 30% { filter: invert(1) hue-rotate(90deg); transform: translateX(-6px);} 60% { transform: translateX(5px);} }

/* 八音盒按钮 */
#bgm-btn {
  position: fixed; left: 14px; bottom: 14px; z-index: 9400;
  background: #c0c0c0; color: #000; border: 3px outset #dfdfdf;
  padding: 6px 12px; font-family: "SimSun", serif; font-size: 13px; cursor: pointer;
}
.tiny { font-size: 11px; color: #666688; }
.red { color: #ff4040; }
::selection { background: #300; color: #ff8080; }