:root {
  --fiery-orange: #ff4a00;
  --bg: #0f1115;
  --panel: #171a21;
  --text: #e7e9ee;
  --muted: #8b94a3;
  --border: #262b36;
  --success: #1f9d55;
  --error: #cf2a2a;
}

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }

body { min-height: 100vh; display: flex; flex-direction: column; }

header {
  padding: 36px 24px 24px;
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

header h1 { margin: 0 0 6px; font-size: 28px; font-weight: 600; color: var(--text); }
header p  { margin: 0; color: var(--muted); font-size: 14px; }

main {
  flex: 1;
  padding: 8px 24px 24px;
  max-width: 760px;
  margin: 0 auto;
  width: 100%;
}

#uppy { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }

/* Uppy dark-ish tweaks that play nicely with its default theme. */
.uppy-Dashboard-inner { background: var(--panel) !important; border: none !important; }

#status { margin-top: 16px; padding: 12px 16px; border-radius: 8px; font-size: 14px; }
#status.error   { background: rgba(207, 42, 42, 0.15); color: var(--error); border: 1px solid var(--error); }
#status.success { background: rgba(31, 157, 85, 0.15); color: var(--success); border: 1px solid var(--success); }

footer { padding: 16px 24px 32px; text-align: center; color: var(--muted); font-size: 12px; }