@font-face{
  font-family:'CloisterBlack';
  src:url('fonts/CloisterBlack copy.ttf') format('truetype');
  font-display:swap;
}
@font-face{
  font-family:'DeathFont';
  src:url('fonts/death_font_ver1_0.ttf') format('truetype');
  font-display:swap;
}
@font-face{
  font-family:'RyukScrawl';
  src:url('fonts/Ryuk Scrawl.ttf') format('truetype');
  font-display:swap;
}
@font-face{
  font-family:'RyuksHandwriting';
  src:url('fonts/RyuksHandwriting copy.ttf') format('truetype');
  font-display:swap;
}
@font-face{
  font-family:'RyukExtra';
  src:url('fonts/RyukExtra copy.ttf') format('truetype');
  font-display:swap;
}
@font-face{
  font-family:'Clers';
  src:url('fonts/clers.ttf') format('truetype');
  font-display:swap;
}
@font-face{
  font-family:'MagazineLetter';
  src:url('fonts/MagazineLetterByBrntlbrnl-Regular.ttf') format('truetype');
  font-display:swap;
}

*{box-sizing:border-box;}
  body{
    margin:0;padding:0;
    background:
      linear-gradient(180deg, #1c1c1c 0%, #101010 40%, #050505 100%);
    color:#cfcfcf;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:12px;
  }
  a{color:#ffffff;text-decoration:underline;}
  a:visited{color:#999999;}
  a:hover{color:#000;background:#fff;}

  @keyframes pulse{ 0%,100%{opacity:1;} 50%{opacity:.35;} }
  @keyframes rainbow-gray{ 0%{color:#fff;} 25%{color:#aaa;} 50%{color:#666;} 75%{color:#aaa;} 100%{color:#fff;} }
  @keyframes wiggle{ 0%,100%{transform:rotate(-2deg);} 50%{transform:rotate(2deg);} }
  @keyframes twinkle{ 0%,100%{opacity:.2;} 50%{opacity:1;} }
  @keyframes shimmer{ 0%{background-position:-200px 0;} 100%{background-position:200px 0;} }

  .pulse-text{animation:pulse 1.6s ease-in-out infinite;}
  .rainbow{animation:rainbow-gray 3s linear infinite;font-weight:bold;}
  .wiggle{display:inline-block;animation:wiggle .4s ease-in-out infinite;}
  .shimmer-text{
    background:linear-gradient(90deg,#888 0%,#fff 50%,#888 100%);
    background-size:200px 100%;
    -webkit-background-clip:text;background-clip:text;color:transparent;
    animation:shimmer 2.5s linear infinite;font-weight:normal;
    font-family:'RyukScrawl',cursive;font-size:16px;
  }

  .stars{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0;}
  .star{position:absolute;color:#fff;font-size:10px;animation:twinkle 2.2s ease-in-out infinite;}

  #rain-canvas{
    position:fixed;top:0;left:0;width:100%;height:100%;
    pointer-events:none;z-index:0;opacity:.5;
  }

  .page{
    max-width:780px;margin:0 auto;position:relative;z-index:1;
    border-left:1px dashed #444;border-right:1px dashed #444;
    background:rgba(0,0,0,.55);
  }

  .banner{
    border-bottom:2px double #444;
    text-align:center;padding:16px 10px 10px;
    background:radial-gradient(ellipse at 50% 0%, #0e0e0e, #000);
  }
  .banner .stars-row{color:#666;letter-spacing:8px;font-size:12px;margin-bottom:4px;}
  .banner h1{
    font-family:'DeathFont','Courier New', monospace;font-weight:normal;
    font-size:46px;color:#fff;margin:6px 0 2px;letter-spacing:2px;
    text-shadow:2px 2px 0 #333;
  }
  .banner .tag{font-size:11px;}
  .banner .visitor-counter{
    margin-top:10px;display:inline-block;background:#0a0a0a;border:1px solid #555;
    padding:4px 8px;font-family:'Courier New',monospace;letter-spacing:3px;
  }
  .visitor-counter .digits{
    background:#000;color:#fff;border:1px inset #555;padding:2px 6px;
    font-weight:bold;letter-spacing:4px;
  }

  .badges-row{
    text-align:center;padding:8px;border-bottom:1px solid #333;background:#0a0a0a;
  }
  .badge{
    display:inline-block;width:88px;height:31px;line-height:31px;
    border:1px solid #666;background:#151515;color:#ddd;
    font-size:9px;margin:2px;vertical-align:middle;overflow:hidden;
    font-family:'Courier New',monospace;
  }
  .badge.construction{
    background:repeating-linear-gradient(45deg,#000 0 6px,#222 6px 12px);
    font-weight:bold;color:#fff;
  }

  table.layout{width:100%;border-collapse:collapse;}
  table.layout > tbody > tr > td{vertical-align:top;padding:10px;}
  td.sidebar{width:160px;border-right:1px dashed #333;}
  td.main{width:auto;}

  .box{border:1px solid #333;margin-bottom:12px;background:#0a0a0a;}
  .box .hd{
    background:#1a1a1a;color:#fff;font-weight:normal;font-size:15px;
    letter-spacing:1px;padding:4px 6px;border-bottom:1px solid #333;
    text-transform:none;font-family:'Clers','Courier New',monospace;
  }
  .box .bd{padding:6px 8px;}

  ul.navlist{list-style:none;margin:0;padding:0;}
  ul.navlist li{padding:2px 0;font-size:11px;}
  ul.navlist li::before{content:"☆ ";color:#666;font-size:9px;}

  .sectionbar{
    background:#1a1a1a;color:#fff;font-weight:normal;font-size:15px;
    letter-spacing:1px;padding:4px 8px;border:1px solid #333;
    text-transform:none;margin:14px 0 6px;
    font-family:'Clers','Courier New',monospace;
  }

  h2.headline{
    font-family:'CloisterBlack','Courier New',monospace;font-size:24px;font-weight:normal;color:#fff;margin:0 0 6px;
  }
  p{line-height:1.5;margin:4px 0 10px;}
  .small{font-size:11px;color:#888;}
  .new-tag{color:#000;background:#fff;font-weight:bold;font-size:9px;padding:1px 4px;margin-left:4px;}

  .guestbook-btn{
    display:block;text-align:center;border:1px solid #666;background:#151515;color:#fff;
    padding:8px;text-decoration:none;font-weight:bold;letter-spacing:1px;font-size:12px;
    margin-top:6px;
  }
  .guestbook-btn:hover{background:#fff;color:#000;}

  .stat-line{border-top:1px dotted #444;padding:4px 0;font-size:11px;}

  .play-btn{
    display:inline-block;border:1px solid #666;background:#151515;color:#fff;
    padding:6px 16px;font-weight:bold;letter-spacing:1px;text-decoration:none;
    font-size:12px;
  }
  .play-btn:hover{background:#fff;color:#000;}

  hr{border:none;border-top:1px dashed #444;margin:10px 0;}

  footer{
    border-top:2px double #444;text-align:center;color:#666;font-size:10px;
    padding:12px 10px;
  }
  footer .madeby{font-family:'RyukExtra','Courier New',monospace;color:#999;font-size:13px;}
  .quote-hand{font-family:'RyuksHandwriting',cursive;font-size:16px;color:#e6e6e6;}


ul.navlist li a.active{color:#fff;font-weight:bold;background:#1a1a1a;padding:1px 4px;text-decoration:none;}
