*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: #f7f5fb;
  color: #1f2937;
  min-height: 100vh;
  padding: 48px 16px;
  line-height: 1.55;
}
.dgt-app {
  max-width: 620px;
  margin: 0 auto;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 4px 24px rgba(43, 29, 98, 0.08);
  padding: 36px;
}
.dgt-title {
  margin: 0 0 16px;
  font-size: 24px;
  font-weight: 700;
  color: #2b1d62;
}
.dgt-intro { margin: 0 0 24px; color: #4b5563; font-size: 15px; }
.dgt-note { margin: 18px 0 0; color: #9ca3af; font-size: 13px; }
.dgt-meta { margin: 0 0 18px; color: #6b7280; font-size: 14px; }
.dgt-btn {
  display: inline-block;
  background: #2b1d62;
  color: #fff;
  text-decoration: none;
  padding: 14px 28px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  transition: background 0.15s ease;
}
.dgt-btn:hover { background: #1d1346; }
.dgt-btn-secondary {
  background: transparent;
  color: #2b1d62;
  border: 1px solid #c4b5fd;
  margin-top: 20px;
}
.dgt-btn-secondary:hover { background: #faf8ff; }
.dgt-status {
  padding: 12px 16px;
  border-radius: 10px;
  font-size: 14px;
  margin: 0 0 20px;
}
.dgt-success { background: #ecfdf5; color: #065f46; border: 1px solid #6ee7b7; }
.dgt-error { background: #fef2f2; color: #991b1b; border: 1px solid #f87171; }
.dgt-field { margin: 0 0 18px; }
.dgt-field label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 6px;
}
.dgt-field textarea {
  width: 100%;
  font-family: 'SF Mono', Menlo, Consolas, monospace;
  font-size: 12px;
  padding: 10px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #f9fafb;
  resize: vertical;
  color: #111827;
}
.dgt-details { margin: 8px 0 0; }
.dgt-details summary { cursor: pointer; color: #6b7280; font-size: 13px; }
.dgt-pre {
  background: #1f2937;
  color: #e5e7eb;
  padding: 14px;
  border-radius: 8px;
  font-size: 12px;
  overflow-x: auto;
  white-space: pre-wrap;
  word-break: break-all;
}
@media (max-width: 480px) {
  body { padding: 20px 12px; }
  .dgt-app { padding: 22px; }
}