body { font-family: Arial, sans-serif; width: 100vw; height: 100vh; background: #101010; color: #fff; } .container { background: #212121; padding: 24px 32px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); } main { display: flex; flex-direction: column; align-items: center; justify-content: center; background: #121212; } nav { padding: 10px 18px; border-radius: 8px; width: 100%; box-shadow: 0 2px 8px rgba(0,0,0,0.08) } h2 { margin-bottom: 20px; color: #ccc; } label { display: block; margin-bottom: 8px; font-weight: 500; } input[type="file"] { margin-bottom: 16px; } button[type="submit"] { background: #007bff; color: #fff; border: none; padding: 10px 18px; border-radius: 4px; cursor: pointer; font-size: 1rem; } button:hover { background: #0056b3; } .preview { margin-top: 16px; max-width: 100%; max-height: 200px; display: none; border: 1px solid #ddd; border-radius: 4px; } .tab-container { display: none; padding: 20px; width: 100%; } .tab-container.active { display: block; } .tab-button { background: #333; color: #fff; border: none; padding: 10px 18px; border-radius: 4px; cursor: pointer; font-size: 1rem; margin-right: 8px; } .tab-button:hover { background: #555; } .tab-button.active { background: #007bff; } .gallery-image { max-width: 90px; max-height: 70px; margin: 10px; border: 2px solid #444; border-radius: 4px; cursor: pointer; transition: border-color 0.3s; }