body { font-family: system-ui, Arial, sans-serif; margin: 0; }
.wrap { max-width: 1000px; margin: 24px auto; padding: 0 16px; }
.grid { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .grid { grid-template-columns: 1fr 1fr; } }
.box { border: 1px solid #ddd; border-radius: 10px; padding: 12px; }
pre { white-space: pre-wrap; word-break: break-word; margin: 0; }
.footer { border-top: 1px solid #eee; padding: 16px; text-align: center; }
.buttons { margin-top: 20px; display: flex; gap: 12px; }

.btn {
  padding: 12px 20px;
  border: 1px solid #ddd;
  border-radius: 10px;
  text-decoration: none;
  color: black;
}

.btn:hover { background: #f3f3f3; }
.desc { max-width: 700px; line-height: 1.5; }