body { font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif; max-width: 720px; margin: 40px auto; padding: 0 16px; color: #222; }
h1 { font-size: 20px; }
label { display: block; margin: 14px 0 4px; font-weight: 600; }
input[type=text], input[type=number], textarea, select { width: 100%; box-sizing: border-box; padding: 8px; font-size: 14px; border: 1px solid #ccc; border-radius: 6px; }
textarea { min-height: 240px; font-family: inherit; }
.row { display: flex; gap: 16px; }
.row > div { flex: 1; }
.actions { margin-top: 20px; display: flex; gap: 10px; flex-wrap: wrap; }
button { padding: 8px 16px; border-radius: 6px; border: 1px solid #333; background: #fff; cursor: pointer; font-size: 14px; }
button.primary { background: #222; color: #fff; }
button:disabled { opacity: 0.5; cursor: default; }
.hint { color: #777; font-size: 12px; }
.error { color: #c0392b; white-space: pre-wrap; }
.images-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; margin-top: 12px; }
.images-grid img { width: 100%; border-radius: 6px; border: 1px solid #eee; }
video { width: 100%; border-radius: 8px; margin-top: 12px; }
.spinner { margin-top: 20px; color: #555; }