* { box-sizing: border-box; }
body {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  margin: 0;
  color: #1a1a1a;
  background: #f6f6f6;
  line-height: 1.45;
}
.top {
  background: #fff;
  border-bottom: 1px solid #ddd;
  padding: 12px 20px;
  font-size: 0.95rem;
}
.top a { color: #0b57d0; text-decoration: none; }
.top a:hover { text-decoration: underline; }
.sep { margin: 0 6px; color: #999; }
.wrap { max-width: 720px; margin: 0 auto; padding: 24px 20px 48px; }
.foot {
  font-size: 0.8rem;
  color: #666;
  padding: 16px 20px;
  border-top: 1px solid #e5e5e5;
  background: #fff;
}
h1 { font-size: 1.35rem; margin-top: 0; }
h2 { font-size: 1.05rem; margin-top: 1.25em; }
.meta, .hint, .small { color: #555; font-size: 0.9rem; }
.bal { margin-bottom: 16px; }
.form label { display: block; margin-top: 12px; font-weight: 600; font-size: 0.9rem; }
.form textarea, .form input[type="text"] {
  width: 100%;
  margin-top: 4px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font: inherit;
}
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 560px) { .row2 { grid-template-columns: 1fr; } }
.consent-block { margin: 20px 0; padding: 12px; background: #fff; border: 1px solid #ddd; border-radius: 8px; }
.check { display: flex; gap: 8px; align-items: flex-start; font-weight: normal; margin-top: 8px; }
.check input { margin-top: 3px; }
button[type="submit"] {
  margin-top: 16px;
  padding: 10px 20px;
  font: inherit;
  cursor: pointer;
  background: #1a1a1a;
  color: #fff;
  border: none;
  border-radius: 6px;
}
button[type="submit"]:disabled { opacity: 0.5; cursor: not-allowed; }
.status { margin-top: 12px; min-height: 1.2em; color: #333; }
.hidden { display: none; }
.lyrics { white-space: pre-wrap; background: #fff; padding: 12px; border-radius: 6px; border: 1px solid #e0e0e0; font-size: 0.9rem; }
audio { width: 100%; margin-top: 8px; }
.tg-widget { margin: 12px 0; }
