:root { --bg:#0b1020; --card:#111a33; --text:#e9eefc; --muted:#a8b3d6; --line:#22305a; --btn:#2e5bff; }
* { box-sizing:border-box; }
body { margin:0; font-family:system-ui, -apple-system, Segoe UI, Roboto, Arial; background:linear-gradient(180deg, var(--bg), #070a14); color:var(--text); }
.container { max-width: 920px; margin: 0 auto; padding: 20px; }
.header { padding: 18px 6px 10px; }
h1 { margin: 0 0 6px; font-size: 28px; }
.subtitle { margin: 0 0 10px; color: var(--muted); }
.meta { display:flex; gap:10px; flex-wrap:wrap; }
.pill { font-size:12px; padding:6px 10px; border:1px solid var(--line); border-radius:999px; color:var(--muted); }
.card { background: rgba(17,26,51,0.9); border: 1px solid var(--line); border-radius: 14px; padding: 14px; margin: 12px 0; box-shadow: 0 12px 30px rgba(0,0,0,0.25); }
.section-head h2 { margin: 0 0 6px; font-size: 18px; }
.note { margin: 0; color: var(--muted); font-size: 13px; }
.field { display:flex; flex-direction:column; gap:8px; }
.label { font-weight:600; }
.help { color: var(--muted); font-size: 13px; }

.radio-group { display:flex; flex-direction:column; gap:8px; }
.radio { display:flex; align-items:center; gap:10px; padding:10px; border:1px solid var(--line); border-radius: 12px; cursor:pointer; }
.radio input { transform: scale(1.1); }
.radio-text { color: var(--text); }

.textarea, .input { width:100%; padding:10px; border-radius: 12px; border:1px solid var(--line); background:#0c1430; color:var(--text); outline:none; }
.textarea:focus, .input:focus { border-color:#3a68ff; }

.likert-row { display:flex; flex-direction:column; gap:10px; }
.likert-label { font-weight:600; }
.likert-scale { display:flex; gap:8px; flex-wrap:wrap; }
.likert-point { display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--line); border-radius: 12px; cursor:pointer; color:var(--muted); }
.likert-point input { transform: scale(1.1); }

.btn { width:100%; border:0; border-radius: 14px; padding: 12px 14px; font-size: 16px; font-weight: 700; background: var(--btn); color:white; cursor:pointer; }
.btn:disabled { opacity: .6; cursor: not-allowed; }
.status { margin-top:10px; color: var(--muted); min-height: 18px; }
.small { color: var(--muted); font-size: 12px; }
.footer { padding: 14px 6px; color: var(--muted); }
.token-box {
  background: #0c1430;
  border: 2px dashed #3a68ff;
  border-radius: 14px;
  padding: 16px;
  margin: 16px 0;
  text-align: center;
}

.token-label {
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 6px;
}

.token-value {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 1px;
  word-break: break-all;
  color: #ffffff;
}

.copy-btn {
  width: 100%;
  border: 0;
  border-radius: 14px;
  padding: 12px;
  font-size: 15px;
  font-weight: 700;
  background: #22c55e;
  color: #0b1020;
  cursor: pointer;
  margin-bottom: 12px;
}

.copy-btn:hover {
  opacity: 0.9;
}

.claim-note {
  font-weight: 600;
  margin-top: 12px;
}