:root {
  --color-background: #F7F2EB;
  --color-surface: #EADFD2;
  --color-text: #2D2926;
  --color-accent: #C77452;
  --color-muted: #7A665A;
  --color-border: #D8C8B8;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background-color: var(--color-background);
  color: var(--color-text);
  font-family: "Zen Kaku Gothic New", sans-serif;
  padding: 60px 40px;
}

table {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  border-collapse: collapse;
}

thead th {
  font-size: 13px;
  letter-spacing: 0.08em;
  color: var(--color-muted);
  text-align: left;
  padding: 6px;
  border-bottom: 2px solid var(--color-accent);
}

tbody tr {
  border-bottom: 1px solid var(--color-border);
  transition: background-color 0.2s;
}

tbody tr:hover {
  background-color: var(--color-surface);
}

tbody td {
  padding: 2px;
  font-size: 14px;
  line-height: 1.6;
  vertical-align: top;
}

td.date {
  white-space: nowrap;
  color: var(--color-muted);
  font-size: 13px;
  width: 80px;
}

td.org {
  width: 360px;
}

@media (max-width: 640px) {
  body { padding: 20px 10px; }

  thead { display: none; }

  table, tbody, tr, td { display: block; width: 100%; }

  tr { padding: 2px 0; border-bottom: 1px solid var(--color-border); }

  tbody td { padding: 0; }

  td.date { color: var(--color-accent); font-size: 12px; }

  td.org { font-weight: 700; }
}