/* ── Report player (หน้าผู้ใช้) — glass dark theme ── */
.rp-page { width: 100%; max-width: 640px; margin: 40px auto; padding: 0 16px; box-sizing: border-box; }

.rp-header { text-align: center; margin-bottom: 26px; }
.rp-emoji { font-size: 2.6rem; line-height: 1; display: block; margin-bottom: 8px; }
.rp-title { font-size: 1.85rem; font-weight: 800; margin: 0 0 4px; color: #fff; }
.rp-sub { color: rgba(255,255,255,.55); font-size: .92rem; }

.rp-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 18px;
  padding: 26px 24px;
}

.rp-field { margin-bottom: 20px; }
.rp-label { display: block; font-weight: 700; font-size: .92rem; color: #fff; margin-bottom: 8px; }
.rp-label i { color: #ff6b6b; margin-right: 6px; }
.rp-label .rp-opt { color: rgba(255,255,255,.4); font-weight: 500; font-size: .8rem; }

.rp-input, .rp-textarea {
  width: 100%;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  color: #fff;
  padding: 11px 14px;
  font-size: .95rem;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.rp-input::placeholder, .rp-textarea::placeholder { color: rgba(255,255,255,.35); }
.rp-input:focus, .rp-textarea:focus {
  outline: none;
  border-color: rgba(255,75,43,.6);
  background: rgba(255,255,255,.07);
  box-shadow: 0 0 0 3px rgba(255,75,43,.15);
}
.rp-textarea { resize: vertical; min-height: 120px; line-height: 1.55; }

/* ── file dropzone ── */
.rp-drop {
  position: relative;
  border: 1.5px dashed rgba(255,255,255,.2);
  border-radius: 12px;
  padding: 22px 16px;
  text-align: center;
  cursor: pointer;
  transition: border-color .15s, background .15s;
  background: rgba(255,255,255,.02);
}
.rp-drop:hover { border-color: rgba(255,75,43,.5); background: rgba(255,75,43,.04); }
.rp-drop input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.rp-drop-ico { font-size: 1.6rem; color: rgba(255,255,255,.4); margin-bottom: 8px; }
.rp-drop-main { font-weight: 600; color: #fff; font-size: .92rem; }
.rp-drop-hint { color: rgba(255,255,255,.4); font-size: .78rem; margin-top: 4px; }
.rp-drop-files { margin-top: 10px; font-size: .82rem; color: #ffd54a; min-height: 1em; }

.rp-submit {
  width: 100%; border: none; border-radius: 12px;
  padding: 13px; font-size: 1rem; font-weight: 800; cursor: pointer;
  color: #fff; background: linear-gradient(135deg, #ff416c, #ff4b2b);
  box-shadow: 0 6px 20px rgba(255,65,108,.3);
  transition: transform .15s, box-shadow .15s;
}
.rp-submit:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(255,65,108,.45); }

.rp-alert { border-radius: 12px; padding: 12px 16px; margin-bottom: 18px; font-weight: 600; font-size: .9rem; text-align: center; }
.rp-alert--ok { background: rgba(34,197,94,.12); border: 1px solid rgba(34,197,94,.35); color: #4ade80; }
.rp-alert--err { background: rgba(239,68,68,.12); border: 1px solid rgba(239,68,68,.35); color: #f87171; }

.rp-note {
  margin-top: 18px; text-align: center; font-size: .8rem; color: rgba(255,255,255,.4);
  display: flex; align-items: center; gap: 8px; justify-content: center;
}