@import url('https://fonts.googleapis.com/css2?family=Special+Elite&display=swap');

body {
  margin: 0;
  padding: 0;
  font-family: "Times New Roman", Times, serif;
  font-size: 14px;
  color: #1a1a1a;
  background-color: #c0c0c0;
  background-image: repeating-conic-gradient(#b8b8b8 0% 25%, #c4c4c4 0% 50%) 0 0 / 8px 8px;
  cursor: default;
}
a { color: #0000cc; }
a:visited { color: #551a8b; }
a:hover { color: #ff0000; text-decoration: underline; }
hr { border: none; height: 2px; background: linear-gradient(90deg, transparent, #808080, #ffffff, #808080, transparent); margin: 8px 0; }
.bevel { border: 2px outset #d4d0c8; background: #d4d0c8; padding: 4px; }
.bevel-in { border: 2px inset #d4d0c8; background: #fffff0; padding: 6px; }
.page-wrap { max-width: 780px; margin: 0 auto; background: #e8e4d8; border-left: 2px solid #ffffff; border-top: 2px solid #ffffff; border-right: 2px solid #404040; border-bottom: 2px solid #404040; }
.header-banner { background: #1a3a1a; background-image: repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(0,0,0,0.05) 3px, rgba(0,0,0,0.05) 4px); text-align: center; padding: 12px 8px; border-bottom: 3px ridge #808080; position: relative; overflow: hidden; }
.header-banner h1 { font-family: "Times New Roman", serif; font-size: 28px; color: #ffcc00; text-shadow: 2px 2px 0px #000000; margin: 0; letter-spacing: 2px; }
.header-banner .tagline { font-size: 12px; color: #88cc88; font-style: italic; margin-top: 2px; }
.header-banner .pine-border { font-size: 10px; color: #2d5a2d; letter-spacing: 6px; margin: 6px 0 0 0; }
.marquee-bar { background: #000033; color: #00ff00; font-family: "Courier New", monospace; font-size: 12px; padding: 3px 0; border-top: 1px solid #003366; border-bottom: 1px solid #003366; overflow: hidden; white-space: nowrap; }
.marquee-bar .scroll-text { display: inline-block; animation: marquee-scroll 75s linear infinite; }
@keyframes marquee-scroll { 0% { transform: translateX(100vw); } 100% { transform: translateX(-200%); } }
.nav-bar { background: #2a4a2a; padding: 4px 8px; text-align: center; border-bottom: 2px groove #808080; }
.nav-bar a { color: #ffff99; font-size: 11px; font-weight: bold; text-decoration: none; padding: 2px 6px; border: 1px outset #5a7a5a; background: #3a5a3a; margin: 1px 2px; display: inline-block; font-family: "Verdana", "Arial", sans-serif; }
.nav-bar a:hover { background: #4a7a4a; color: #ffffff; border: 1px inset #5a7a5a; }
.nav-bar a.active { border: 1px inset #5a7a5a; background: #2a3a2a; color: #ffffff; }
.main-table { width: 100%; border-collapse: collapse; }
.col-left { width: 160px; background: #d2cfbf; vertical-align: top; padding: 6px; border-right: 2px groove #b0b0a0; font-size: 12px; }
.col-center { vertical-align: top; padding: 8px; background: #ece8d8; }
.col-right { width: 175px; background: #d8d4c4; vertical-align: top; padding: 6px; border-left: 2px groove #b0b0a0; font-size: 11px; }
.sidebar-box { border: 2px inset #b0b0a0; background: #fffff4; padding: 5px; margin-bottom: 8px; }
.sidebar-box h4 { margin: 0 0 4px 0; font-size: 12px; color: #660000; border-bottom: 1px solid #c0b8a0; padding-bottom: 2px; font-family: "Verdana", sans-serif; }
.sidebar-box ul { margin: 2px 0; padding-left: 16px; list-style: square; }
.sidebar-box li { margin-bottom: 3px; font-size: 11px; line-height: 1.3; }
.section-header { background: #2a3a5a; color: #ffffff; font-family: "Verdana", sans-serif; font-size: 13px; font-weight: bold; padding: 3px 8px; border: 1px outset #4a5a7a; margin-top: 10px; margin-bottom: 4px; }
.section-header:first-child { margin-top: 0; }
.content-box { border: 1px solid #a0a090; background: #fffff8; padding: 6px 8px; margin-bottom: 8px; font-size: 13px; line-height: 1.5; }
.missing-poster { border: 3px double #cc0000; background: #fff8f0; padding: 6px; text-align: center; margin: 6px 0; }
.missing-poster .missing-title { color: #cc0000; font-weight: bold; font-size: 16px; letter-spacing: 3px; }
.missing-poster .missing-photo { width: 80px; height: 95px; background: #d0d0d0; border: 1px solid #999; margin: 4px auto; display: flex; align-items: center; justify-content: center; font-size: 9px; color: #888; position: relative; overflow: hidden; }
.missing-poster .missing-photo::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, transparent 0px, transparent 2px, rgba(0,0,0,0.03) 2px, rgba(0,0,0,0.03) 4px); }
.weather-box { border: 2px inset #a0a090; background: #eeeedd; padding: 6px; text-align: center; font-size: 11px; margin-bottom: 8px; }
.weather-box .temp { font-size: 22px; font-weight: bold; color: #336699; }
.visitor-counter { text-align: center; padding: 6px; font-size: 10px; font-family: "Verdana", sans-serif; color: #666666; }
.counter-digits { display: inline-flex; gap: 1px; margin: 3px 0; }
.counter-digits span { background: #000000; color: #00ff00; font-family: "Courier New", monospace; font-size: 14px; font-weight: bold; padding: 2px 4px; border: 1px inset #333; min-width: 12px; text-align: center; }
.blink { animation: blink-anim 1s step-end infinite; }
@keyframes blink-anim { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
.new-icon { display: inline-block; background: #ff0000; color: #ffff00; font-size: 9px; font-weight: bold; font-family: "Arial", sans-serif; padding: 0 3px; animation: blink-anim 1.2s step-end infinite; vertical-align: middle; margin-left: 4px; letter-spacing: 1px; }
.under-construction { text-align: center; padding: 6px; font-size: 11px; color: #996600; }
.construction-icon { font-size: 20px; animation: spin-icon 2s linear infinite; display: inline-block; }
@keyframes spin-icon { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.guestbook-entry { border-bottom: 1px dashed #c0b8a0; padding: 4px 0; font-size: 12px; }
.guestbook-entry:last-child { border-bottom: none; }
.gb-name { font-weight: bold; color: #003366; }
.gb-date { font-size: 10px; color: #888; font-style: italic; }
.footer-area { background: #1a3a1a; padding: 10px; text-align: center; border-top: 3px ridge #808080; font-size: 10px; color: #88aa88; }
.footer-area a { color: #aaccaa; font-size: 10px; }
.web-ring { margin: 8px 0; padding: 5px; border: 1px dashed #4a6a4a; display: inline-block; }
.badge { display: inline-block; border: 1px outset #666; padding: 2px 6px; font-size: 9px; font-family: "Verdana", sans-serif; margin: 2px; background: #333; color: #ccc; }
.bulletin-post { padding: 5px 0; border-bottom: 1px dotted #ccc; font-size: 12px; }
.bulletin-post:last-child { border-bottom: none; }
.post-date { font-size: 10px; color: #666; font-family: "Courier New", monospace; }
.post-author { color: #003366; font-weight: bold; font-size: 11px; }
.glitch-text { font-size: 1px; color: #e8e4d8; user-select: all; line-height: 0; overflow: hidden; display: block; height: 0; }
.tiny-creep { font-size: 6px; color: #d8d4c8; text-align: center; line-height: 1; letter-spacing: 2px; }
.balloon-float { position: fixed; right: 30px; bottom: -60px; font-size: 28px; animation: float-up 45s linear infinite; opacity: 0.6; z-index: 999; pointer-events: none; }
@keyframes float-up { 0% { bottom: -60px; opacity: 0; } 2% { opacity: 0.5; } 95% { opacity: 0.4; } 100% { bottom: 110vh; opacity: 0; } }
.scanlines { pointer-events: none; position: fixed; inset: 0; background: repeating-linear-gradient(0deg, transparent 0px, transparent 3px, rgba(0,0,0,0.015) 3px, rgba(0,0,0,0.015) 4px); z-index: 9998; }
.img-placeholder { background: #ccc; border: 1px solid #999; display: inline-flex; align-items: center; justify-content: center; font-size: 9px; color: #777; font-family: sans-serif; overflow: hidden; position: relative; }
.construction-stripes { height: 10px; background: repeating-linear-gradient(-45deg, #ffcc00 0px, #ffcc00 10px, #000000 10px, #000000 20px); }
.fake-ad { border: 2px outset #aaa; background: #fff; text-align: center; padding: 4px; margin: 6px 0; font-size: 10px; }
.fake-ad .ad-title { font-weight: bold; color: #cc0000; font-size: 12px; }
.event-row { display: flex; gap: 6px; padding: 3px 0; border-bottom: 1px dotted #d0ccc0; font-size: 12px; }
.event-date-badge { background: #990000; color: #fff; font-size: 9px; font-weight: bold; padding: 2px 4px; font-family: "Verdana", sans-serif; min-width: 42px; text-align: center; flex-shrink: 0; }
.hover-reveal { cursor: default; }
.hover-reveal:hover .hidden-msg { color: #990000 !important; font-size: 9px !important; }
.sewer-notice { background: #fff3e0; border: 1px solid #cc9900; border-left: 4px solid #cc6600; padding: 5px 8px; margin: 6px 0; font-size: 11px; }
.police-item { padding: 3px 0; font-size: 11px; border-bottom: 1px dotted #d0d0d0; }
.police-date { font-family: "Courier New", monospace; font-size: 10px; color: #666; }
.midi-player { background: #d4d0c8; border: 2px outset #e0dcd0; padding: 4px 8px; display: inline-flex; align-items: center; gap: 6px; font-size: 10px; font-family: "Verdana", sans-serif; margin: 4px 0; }
.midi-btn { background: #c0c0c0; border: 1px outset #ddd; padding: 1px 5px; font-size: 10px; cursor: pointer; }
.midi-btn:active { border: 1px inset #ddd; }
@keyframes subtle-red { 0%, 100% { border-color: #cc0000; } 50% { border-color: #ff3333; } }
.red-pulse { animation: subtle-red 3s ease-in-out infinite; }
.email-link { font-family: "Courier New", monospace; font-size: 11px; }
.corrupted-img { position: relative; }
.corrupted-img::before { content: ''; position: absolute; top: 30%; left: 0; right: 0; height: 8px; background: linear-gradient(90deg, transparent 0%, #88aa88 15%, #445544 20%, transparent 25%, #998877 40%, transparent 50%, #667766 65%, transparent 80%); opacity: 0.5; z-index: 2; }