html, body {
      margin: 0;
      padding: 0;
      overflow: auto;
    }

    body {
      display: flex;
      flex-direction: column;
      align-items: center;      
      justify-content: flex-start;
      box-sizing: border-box;
      font-family: monospace, Consolas, 'Courier New', Fixedsys;
      font-size: 90%;
      background-color: #ffffff;
      color: #000000;
    }

body.dark-mode {
  background-color: #000000;
  color: #ffffff;
}

a {
  color: inherit;
}

#theme-toggle {
  position: fixed;
  top: 32px;
  right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 20px;
  transition: background 0.2s ease, transform 0.1s ease;
  z-index: 1000;
}

#theme-toggle:hover {
  background: rgba(0, 0, 0, 0.1);
}

body.dark-mode #theme-toggle {
  background: rgba(255, 255, 255, 0.1);
}

body.dark-mode #theme-toggle:hover {
  background: rgba(255, 255, 255, 0.2);
}

#theme-toggle:active {
  transform: scale(0.95);
}

    img {
      max-width: 100%;
      height: auto;
      margin-top: 20px;
      margin-bottom: 20px;
    }

    .content {
      white-space: pre-wrap;     
      text-align: left;           
      max-width: 600px;        
      padding: 0 16px 40px;     
      box-sizing: border-box;
    }