Spaces:
Sleeping
Sleeping
| body { | |
| margin: 0; | |
| min-height: 100vh; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| background: linear-gradient(135deg, #667eea, #764ba2); | |
| font-family: Arial, sans-serif; | |
| } | |
| .card { | |
| background: white; | |
| border-radius: 20px; | |
| padding: 35px; | |
| width: 760px; /* wider card */ | |
| text-align: center; | |
| box-shadow: 0 6px 25px rgba(0,0,0,0.25); | |
| } | |
| h1 { | |
| margin-bottom: 8px; | |
| } | |
| p { | |
| color: #555; | |
| } | |
| .examples { | |
| display: grid; | |
| grid-template-columns: repeat(5, 1fr); /* 5 images per row */ | |
| gap: 18px; | |
| margin: 25px 0; | |
| } | |
| .item img { | |
| width: 100%; | |
| height: 100px; | |
| object-fit: cover; | |
| border-radius: 14px; | |
| } | |
| .item p { | |
| margin-top: 6px; | |
| font-size: 14px; | |
| } | |
| input[type="file"] { | |
| margin-top: 10px; | |
| } | |
| button { | |
| background: #4a6cf7; | |
| color: white; | |
| border: none; | |
| padding: 12px 24px; | |
| font-size: 16px; | |
| border-radius: 12px; | |
| cursor: pointer; | |
| } | |
| button:hover { | |
| background: #3451d1; | |
| } | |
| .result { | |
| margin-top: 20px; | |
| padding: 15px; | |
| background: #f4f6ff; | |
| border-radius: 12px; | |
| } | |