@import url('https://fonts.googleapis.com/css2?family=Baloo+2&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rounded+M+1c&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');

html {
  line-height: 1.4;
  -webkit-text-size-adjust: 100%;
  background-color: #000;
  color: #f8f1f1;
  font-family: 'Rounded M+ 1c', 'Baloo 2', 'Comic Sans MS', 'Hiragino Kaku Gothic Pro', 'Meiryo', sans-serif;
}

body {
  margin: 0;
  background-color: #000;
  color: #f8f1f1;
  font-weight: normal;
}

a {
  color: #ff4d4d; /* かわいい赤 */
  text-decoration: underline dotted;
}

a:hover {
  color: #ff1a1a; /* 濃い赤 */
  text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
  color: #f8f1f1;
  font-family: 'Rounded M+ 1c', 'Baloo 2', monospace;
  line-height: 1.4;
  margin-top: 1em;
  margin-bottom: 0.5em;
  font-weight: bold;
}

h1 {
  font-size: 2.4rem;
}

h2 {
  font-size: 1.8rem;
}

p {
  font-size: 1rem;
  margin: 0 0 1em 0;
}

code, pre {
  font-family: 'Courier New', Courier, monospace;
  background-color: #222;
  color: #f8f1f1;
  border-radius: 10px;
  border: 2px solid #fff; /* 白い枠 */
  box-sizing: border-box;
}

pre {
  padding: 1em;
  overflow-x: auto;
  margin-bottom: 1em;
}

.entry-content hr {
  border: none;
  border-top: 1px solid #660000;
  margin: 2em auto;
  width: 50%;
}

#container, #footer {
  padding-left: 10px;
  padding-right: 10px;
  max-width: 900px;
  margin: auto;
}

.entry-header {
  border-bottom: 1px solid #660000;
  padding-bottom: 1em;
  margin-bottom: 2em;
  color: #cc9999;
}

.entry-title {
  font-size: 1.6rem;
  color: #f8f1f1;
  margin: 0 0 0.5em 0;
}

.entry-title a {
  color: #f8f1f1;
  text-decoration: none;
}

.entry-title a:hover {
  color: #ff1a1a;
  text-decoration: underline;
}

.comment-box .comment {
  font-size: 0.85rem;
  color: #cc9999;
}

.comment-user-name {
  font-weight: bold;
  color: #f8f1f1;
}

.comment-content {
  color: #cc9999;
  margin-bottom: 0.6em;
}

button, input, select, textarea {
  background-color: #222;
  border: 1px solid #ff1a1a;
  color: #f8f1f1;
  font-family: 'Rounded M+ 1c', 'Baloo 2', monospace;
  border-radius: 8px;
  padding: 0.4em 0.8em;
  transition: background-color 0.3s ease;
}

button:hover, input:hover, select:hover, textarea:hover {
  background-color: #ff1a1a;
  border-color: #cc0000;
  color: #000;
}

.entry-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  margin-bottom: 1em;
}

.entry-content table th,
.entry-content table td {
  border: 1px solid #660000;
  padding: 8px 12px;
  background-color: #222;
  color: #f8f1f1;
}

.entry-content table th {
  font-weight: bold;
  background-color: #660000;
}
