:root {
  color-scheme: dark;
  font-family: "Yu Gothic UI", "Noto Sans JP", sans-serif;
  background: #050304;
  color: #ead8ca;
}

* { box-sizing: border-box; }

body {
  min-height: 100vh;
  margin: 0;
  padding: 42px 18px;
  background:
    radial-gradient(circle at 50% 15%, rgba(101, 25, 34, .28), transparent 42%),
    linear-gradient(145deg, #100608, #030303 62%);
}

.form-shell {
  width: min(760px, 100%);
  margin: 0 auto;
  padding: 34px 38px 38px;
  border: 1px solid rgba(179, 73, 72, .48);
  background: rgba(12, 5, 7, .94);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .55), inset 0 0 45px rgba(95, 18, 25, .1);
}

.eyebrow {
  margin: 0 0 9px;
  color: #d66c75;
  font: 600 12px/1.4 ui-monospace, monospace;
  letter-spacing: .28em;
}

h1 { margin: 0; color: #fff0df; font-size: clamp(26px, 5vw, 38px); letter-spacing: .06em; }
.lead { margin: 13px 0 24px; color: #bea9a0; line-height: 1.8; }
form { display: grid; gap: 19px; }
.two-column { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
label { display: grid; gap: 7px; color: #e7cab9; font-size: 14px; font-weight: 700; }
.optional { color: #957f79; font-size: 12px; font-weight: 400; }
fieldset { margin: 0; padding: 0; border: 0; }
legend { margin-bottom: 9px; color: #e7cab9; font-size: 14px; font-weight: 700; }
.checkbox-group { display: flex; flex-wrap: wrap; gap: 9px; }
.checkbox-option { display: flex; align-items: center; gap: 7px; min-width: 140px; padding: 10px 12px; border: 1px solid rgba(145, 55, 58, .5); background: rgba(4, 2, 3, .72); font-weight: 500; cursor: pointer; }
.checkbox-option input { width: 17px; height: 17px; margin: 0; accent-color: #a92d3a; }

input, select, textarea {
  width: 100%;
  border: 1px solid rgba(145, 55, 58, .62);
  border-radius: 0;
  outline: none;
  background: rgba(4, 2, 3, .92);
  color: #f4e3d6;
  padding: 11px 12px;
  font: inherit;
}

textarea { min-height: 126px; resize: vertical; line-height: 1.65; }
input:focus, select:focus, textarea:focus { border-color: #d77e68; box-shadow: 0 0 0 2px rgba(176, 45, 54, .18); }
input[type="file"] { padding: 9px; color: #bba59b; }

.actions { display: flex; align-items: center; gap: 16px; margin-top: 4px; }
button {
  min-width: 180px;
  border: 1px solid #d28665;
  background: linear-gradient(#9d2835, #68141e);
  color: #fff1dc;
  padding: 13px 25px;
  font: 700 15px/1.2 inherit;
  letter-spacing: .08em;
  cursor: pointer;
}
button:hover { background: linear-gradient(#b53743, #791923); }
button:disabled { cursor: wait; opacity: .55; }
.status { min-height: 22px; color: #c7b1a7; font-size: 14px; }
.status.success { color: #9ed6ae; }
.status.error { color: #f09898; }
.build { margin-top: 28px; color: #725f5c; font: 11px/1.5 ui-monospace, monospace; }

@media (max-width: 620px) {
  body { padding: 16px 10px; }
  .form-shell { padding: 25px 20px 28px; }
  .two-column { grid-template-columns: 1fr; }
  .actions { align-items: stretch; flex-direction: column; }
  button { width: 100%; }
}