* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
  background: linear-gradient(180deg, #0b1026 0%, #1a2151 60%, #2c2a6b 100%);
  color: #2b2b2b;
  min-height: 100vh;
}
.wrap { max-width: 640px; margin: 0 auto; padding: 16px; }
.hero {
  text-align: center;
  color: #fff;
  padding: 28px 8px 20px;
}
.hero .fw { font-size: 42px; letter-spacing: 6px; }
.hero h1 { margin: 8px 0 4px; font-size: 24px; }
.hero p { margin: 0; color: #c9cdf0; font-size: 14px; }
.card {
  background: #fffdf8;
  border-radius: 14px;
  padding: 20px 22px;
  margin-bottom: 18px;
  box-shadow: 0 4px 18px rgba(0,0,0,.35);
}
.card h2 {
  font-size: 18px;
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid #e8b64c;
}
.info-table { width: 100%; border-collapse: collapse; margin: 6px 0 10px; }
.info-table th, .info-table td {
  text-align: left; padding: 8px 6px; border-bottom: 1px solid #eee2c8;
  font-size: 15px; vertical-align: top;
}
.info-table th { width: 6.5em; color: #8a6d1f; white-space: nowrap; }
.notes { padding-left: 1.2em; margin: 8px 0; font-size: 14px; color: #444; }
.notes li { margin-bottom: 6px; }
label { display: block; font-weight: 700; margin: 14px 0 4px; font-size: 15px; }
label .req { color: #c0392b; font-size: 12px; margin-left: 6px; }
input[type=text], input[type=tel], input[type=password], select, textarea {
  width: 100%; padding: 10px; font-size: 16px;
  border: 1px solid #c9bd9c; border-radius: 8px; background: #fff;
}
textarea { min-height: 80px; }
.num-row { display: flex; gap: 12px; }
.num-row > div { flex: 1; }
.btn {
  display: block; width: 100%; margin-top: 20px; padding: 14px;
  font-size: 17px; font-weight: 700; color: #fff;
  background: linear-gradient(180deg, #e8734c, #d1502a);
  border: none; border-radius: 10px; cursor: pointer;
}
.btn:active { transform: translateY(1px); }
.error {
  background: #fdecea; color: #b03a2e; border: 1px solid #f5b7b1;
  border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; font-size: 14px;
}
.done { text-align: center; padding: 30px 10px; }
.done .mark { font-size: 46px; }
.footer { text-align: center; color: #9aa0d0; font-size: 12px; padding: 14px 0 30px; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 13px; background: #fff; }
.admin-table th, .admin-table td { border: 1px solid #ddd; padding: 6px 8px; text-align: left; }
.admin-table th { background: #f3ecd9; }
.toolbar { display: flex; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.toolbar a {
  background: #2c2a6b; color: #fff; text-decoration: none;
  padding: 8px 14px; border-radius: 8px; font-size: 14px;
}
